JQuery Problem: Skript (manchmal) schlägt auf (einige Versionen von) IE7

Question

Ich verwende eine Bildüberblendungsmethode über jQuery auf einer Website. Aus Gründen der Vertraulichkeit kann ich nicht schreibe die gesamten Code der Website, aber hier ist die Javascript für den Crossfader (basierend auf this reference):

 <script type="text/javascript"> 
     $(function() { 
      if ($.browser.msie && $.browser.version < 7) return;   
      $('#nav li')  
      .removeClass('highlight').find('a').append('<span class="hover" />').each(function() { 
       var $span = $('> span.hover', this).css('opacity', 0); 
       $(this).hover(function() { 
       $span.stop().fadeTo(250, 1); 
       }, function() { 
       $span.stop().fadeTo(250, 0); 
       }); 
      }); 
     }); 
    </script> 

Es funktioniert swimmingly auf allen Browsern - einschließlich der Installation von IE7 auf meinem Test-PC. Auf anderen PCs mit IE7 schlägt der Effekt manchmal jedoch fehl,. Die Bilder werden geladen, aber wenn Sie darüber schweben, wird keine Wirkung erzielt. Dies bedeutet, dass der JS nicht vollständig fehlschlägt - in diesem Fall würden die Rollovers immer noch funktionieren, nur ohne Fading. Stattdessen scheint IE7 die Klasse "highlight" zu entfernen, stoppt dann aber.

Der wirklich bizarre Teil? Der Fehler ist 100% zufällig. Wenn ich das Fenster aktualisiere, funktioniert der Effekt manchmal einwandfrei. Wie kann das sein?

UPDATE: Ich habe festgestellt, dass das Problem irgendwo mit den AJAX-Skripten liegt, die die Website antreibt. Wenn Sie alle AJAX entfernen und durch statischen Inhalt ersetzen, wird der Fehler behoben. Meine Theorie ist, dass beim Laden der Seite manchmal der AJAX-Inhalt abgeschlossen wird, bevor das Bild geladen wird. Dies führt dazu, dass IE7 ausflippt und den Crossfade-Effekt aufhebt. Wenn ich richtig liege, dass dies das Problem ist, lautet die Frage: Wie kann ich das beheben?

UPDATE 2: weiter in den Kaninchenbau gehen, mit Fiddler, merke ich eine konsequente Sache für jede erfolgreiche Belastung des Effekts in IE7: das Laden des Hauptbildes, das ich für den Schwebe verwendet, wird abgebrochen , dann wieder geladen. Dies passiert nicht, wenn der Effekt nicht erfolgreich ist. Anders ausgedrückt: Wenn der Browser gezwungen wird, die Bilder mit einer einfachen jQuery-Preloader-Funktion zu laden, wird der Cross-Effekt in IE7 jedes Mal unterbrochen und nicht nur der sporadisch arbeitende Zustand.

Dies ist einfach zu bizarr für mich zu verstehen, aber irgendwelche Ideen sind sicherlich willkommen.

Answer 1

Ist Ihr CSS enthalten, bevor Sie die Bereit-Funktion aufrufen? Von the docs:

Hinweis: Bitte stellen Sie sicher, dass alle Stylesheets, bevor Ihre Skripte enthalten sind (vor allem diejenigen, die bereit Funktion aufrufen). Dadurch wird sichergestellt, dass alle Elementeigenschaften korrekt definiert sind, bevor der jQuery-Code ausgeführt wird. Dies kann zu sporadischen Problemen führen, insbesondere bei WebKit-basierten Browsern wie Safari.

Ich verstehe IE ist nicht WebKit basiert, aber es lohnt sich zu überprüfen.