Jquery-Animationen sind in Google Chrome langsam

Question

Ich bin mir nicht sicher, ob diese Frage wirklich spezifisch für SO ist, aber ich möchte sie trotzdem stellen.

Hat jemand bemerkt, dass Jquery-Animationen weniger glatt auf Chrome, wenn Sie nur ein Jquery-Plugin finden es scheint sehr schön, aber in der Regel auf Demo-Seiten gibt es eine kleine Menge von Tags und andere Javascript funcions. Ich arbeite zur Zeit an einem Projekt mit reichhaltiger interaktiver Oberfläche und verwende eine Menge fadeIn() und fadeOut() Funktionen (mit 300 als Argument). Während in IE9, Opera und FF4 sie sehr glatt laufen, kann Chrome sie nicht richtig darstellen.

Zum Beispiel zeigt Chrome in sehr "unsmooth" Weise so eine einfache Aufgabe wie Display 400x100px div mit festen Position mit Funktion fadeIn (300).

Ist das nur mein Problem, oder haben Sie in letzter Zeit etwas Ähnliches festgestellt? Ich habe Stable- und Dev-Releases ausprobiert, aber ohne Erfolg, und wie ich bereits erwähnt habe, können alle anderen Browser glatte Animationen verarbeiten.

Aktualisierung: Dies ist ein Beispiel:

$('#ms_cal_menu').click(function() {
    var offset = $(this).offset();
    $('#cal_submenu').css("top", offset.top+'px').css('left', offset.left-5+'px').fadeIn(300);        
});

Answer 1

Ich glaube, Sie schaffen eine Wettlaufsituation. Wenn Sie Untermenüs verwenden und von hier nach dort klicken, starten Sie jedes Mal einen Prozess - und jeder Prozess muss Zeit haben, um abgeschlossen zu werden.

Was passiert, wenn Sie zu einem anderen Menüpunkt wechseln wollen? Wird durch das Herausziehen der Maus eine Ausblendung gestartet? Was passiert, wenn die Einblendung nicht abgeschlossen ist?

Ich weiß, Sie sagen, dass es in anderen Browsern "funktioniert", aber ich wette, ich könnte es in ein paar Sekunden zum Umfallen bringen. Sie müssen Verhaltensweisen kontrollieren, die zu Race Conditions führen können, aber abgesehen davon wird es für Ihre Benutzer nach einer Weile ziemlich nervig sein, wenn jede Auswahl eines Menüs eine auffällige Animation auslöst. Das ist auf den ersten Blick "hübsch" - aber in der täglichen Anwendung schmerzhaft.

Können Sie nicht einfach eine .show() y .hide() ?