2009-05-31 14 views
0

ich auf meiner Website diesen Code verwende:Toggle nicht in IE arbeiten

var panel = $('.couch-hide'); 
    var originalPos = panel.css("right"); 
    panel.toggle(function() {$(this).animate({right:0},1000, 'easeOutBounce');},function(){$(this).animate({right:originalPos},1000);} 

); 

In FF es einwandfrei, aber in IE funktioniert, ist es nicht auf Klick eingeblendet. Auch, da ich das CSS-Recht verwende, zeigt es die horizontalen Bildlaufleisten, aber in FF nicht. Irgendwelche Ideen, was ich tun kann, um dieses Problem zu beheben?

+0

Haben Sie überprüft, welchen Wert "originalPos" im IE hat? –

+0

Was wäre der beste Weg, das zu überprüfen? Sie sprechen über die Variable richtig? Lass mich versuchen, einen Feuerwächter zu finden, aber für IE, ich weiß, dass da draußen einer ist. – Coughlin

+0

Ich fand das: http://www.debugbar.com/?langage=en - Ich werde das ausprobieren. – Coughlin

Antwort

1

Nun, funktioniert das gleiche für mich in Opera, Firefox und IE6/8.

den Code mit unten:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en"> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <title>sandbox</title> 
    <script type="text/javascript" src="jquery.js"></script> 
    <script type="text/javascript" src="jquery.easing.js"></script> 
    <script type="text/javascript"> 
    $(function(){ 
     var panel = $('.couch-hide'); 
     var originalPos = panel.css("right"); 
     panel.toggle(
     function(){$(this).animate({right:0}, 1000, 'easeOutBounce');}, 
     function(){$(this).animate({right:originalPos}, 1000);} 
    ); 
    }); 
    </script> 
    <style type="text/css"> 
    .couch-hide { 
     position: absolute; 
     right: 100px; 
    } 
    </style> 
</head> 
<body> 
    <div class="couch-hide">Click me!</div> 
</body> 
</html> 

Der Text prallt gegen den rechten Rand des Bildschirms, und fliegt dann zurück.

Obwohl mit toggle zu tun, scheint das seltsam. Zumindest die Dokumentation erwähnt nicht, was passieren soll, wenn Sie zwei Funktionen dafür bereitstellen. Oder wird das Verhalten von jquery.easing.js hinzugefügt? Nicht vertraut mit diesem.

Es wäre hilfreich, wenn Sie auch HTML und CSS zur Verfügung stellen würden.

+0

Hey, Entschuldigung für die Verzögerung und danke für die Antwort, siehe in FF funktioniert es gut hier: http://www.catonthecouchproductions.com/new/ - aber in IE werden Sie sehen, was ich meine. Vielen Dank. – Coughlin

+0

Zunächst wird console.log() nicht vom IE (und einigen anderen Browsern) unterstützt und das Skript stürzt an diesem Punkt ab. Danach scheint die Couch vom Bildschirm entfernt zu sein und IE fügt eine horizontale Bildlaufleiste hinzu. Um das zu vermeiden, möchten Sie vielleicht stattdessen versuchen, es als Hintergrundbild zu animieren ... Ich weiß es nicht wirklich, ich musste nichts dergleichen tun. –