jQuery Lockerung Animation Fenster blättern in Firefox (Bug oder meinen schlechten?)

Question

DAS BEISPIEL
In erster Linie ist hier mein Code und Problem:
http://www.nathanstpierre.com/MBX/showoff.html

DER AUSGABE
Also, was ich sehe ist, wenn Sie die Tasten auf der linken Seite klicken, um die Fenster scrollt auf die entsprechende Überschrift. In jedem Browser aber Firefox (einschließlich ... IE Keuchen ) Dies ist sehr glatt. Wenn Sie jedoch die Höhe des Fensters zu reduzieren, wird es auf alle Computer glätten. Ich habe bereits versucht, diese auf mehreren Computern und auf IE 8.7, Google Chrome, Safari und Firefox 3.5. Ich habe jedes Bit der Grafik und Farbe auf der Seite beseitigt, so dass dies nicht das Problem ist. Ich habe loswerden der Sidebar bekommen, die Sie folgt, das ist es nicht.

Die Theorie
Ich denke, dass die jQuery-Plugin die Entfernung berechnet erleichtert, dass Sie gehen sind, um, und dann aufteilt die Anzahl der Pixel pro Einheit der Dauer es muss bewegen angegeben (etwa 300 Pixeln über 30 Millisekunden, so 10px / ms). Jeder andere Browser scheint dies einen reibungslosen Übergang machen zu können, aber vielleicht die Granularität durch das Fenster Scrollereignis versehen ist nicht genug für Firefox komprimiert, um diese glatt erscheinen? Oder vielleicht bin ich mit der falschen Lockerungen Plugin, oder die falschen Einstellungen.

der Code

$("#sidenav a").click(function () {
        $("#sidenav a").animate({'color':'#6d6d6d'},{"duration":400});
        $(this).animate({"color":"#fff"},{"duration":400});
        clicktarget=$(this).attr("href");
        $("html, body").animate({scrollTop: $(clicktarget).offset().top},{"duration":300,"easing":"easeout"});
        return false;
      });

Die Logik

In dem jedem einen Tag auf dem sidenav onClick einen Ereignis-Listener. Dies wird erhalten, die Versatz (). Oberseite des Elements in dem Dokument mit der gleichen ID wie das href Attribut dieser Verbindung und dann animiert aus dem aktuellen scrollTop des Offset (). Top dieses Elements. Die Logik ist Klang und reibungslos funktioniert in jedem Browser AUSSER Firefox ... soweit ich das beurteilen kann.

THE PLEA

Was mache ich falsch? Ist das ein Fehler?

Danke!

DAS UPDATE

Nun, ich kann nicht mit gutem Gewissen wählte eine der Antworten hier dargestellt, da keiner von ihnen tatsächlich eine Lösung in die Frage gegeben haben, also, wenn Sie im Anschluss an diesen wählen Sie Ihre Favoriten und die Prämie auf den man gehen mit den höchsten Stimmen.

Das Problem scheint der Weg zu sein, dass Firefox a) macht Transparenz und b) befasst sich mit Scroll-Ereignisse. Potenziell mit genügend Prozessorleistung ist dies kein Thema, aber was traurig macht mich ist, dass IE (von allen Browsern) der macht diese feinen auf minderwertige Hardware fähig ist. Ich werde nähern Mozilla mit dem Thema und sehen, ob sie etwas haben, darüber zu sagen.

Für zusätzliche Erbauung, die folgenden werden kostenlos zur Verfügung gestellt:

mit Transparenz
Ohne Transparenz

EDIT: Also die Frage beantwortet wurde, aber jetzt kann ich sie nicht wählen. Wer weiß, was mit dem liegt?

FINAL UPDATE Genug Zeit war vergangen, dass sie lassen Sie mich die Prämie zurück, so dass ich die Antwort wählt, die richtig war. Es sieht aus wie box-shadow und ein paar andere Effekte verursachen einige Scrollen Probleme in Firefox wegen der Art, sie zu machen. FF 4.0 + Griffe dies besser, aber einige Computer haben immer noch Probleme. Dies ist ein großer Heads-up für Menschen, die Umsetzung CSS3. Test der Interaktion auf allen Browsern und sehen, ob die Leistungskosten vertretbar sind

Answer 1

Die schlechte Leistung scheint durch die -moz-box-shadow Eigentum verursacht werden, wenn Sie irgendwelche Erklärungen dieser Eigenschaft entfernen (oder deaktivieren Sie sie mit Firebug) das Scrollen Animation viel glatter ist.

Answer 2

Bitte versuchen Sie jQuery 1.4. Das scheint das viel schneller, dann jQuery 1.3.2.

Wenn Sie diese Art von Dingen zu debuggen, setzen die unkomprimierten js Dateien in Ihrem Code und verwenden Sie Firebug mit ihrem Profil, um die Funktionen zu profilieren.

Answer 3

Sie Seite ist ein bisschen schwer mit den beiden Hintergründen (ein ein transparentes .png sein ..)

Das Problem ist, mit Firefox und / oder Sie Maschine der Animation Handhabung. Überprüfen Sie die Smooth Scrolling Option von Firefox ( Extras -> Einstellungen -> Erweitert -> Allgemein -> Benutzung Smooth Scrolling ). Es könnte der Grund sein, wenn es abgehakt ist ...

Answer 4

wenn ich einen ähnlichen Effekt haben versucht i scrollTo verwendet haben. vielleicht, dass Wille Hilfe

scrollTo Plugin

Answer 5

Ich habe das gleiche Problem mit FF 3.5 habe - sieht definitiv wie ein Rendering Problem. Wenn Sie es versuchen, neue 3.6 wird es wohl in Ordnung sein.

Ich war btw Slider 2.0 Probleme mit Doherty Coda hat.

Viele Grüße

Andrej