Ich möchte 2 Dinge gleichzeitig animieren, wenn die Maus etwas bewegt.
zum Beispiel möchte ich die Hintergrundfarbe von box1 mit id="box1" und die Position von box2 mit id="box2" ändern, wenn die Maus ein div mit id="trigger" schwebt.
aber ich möchte nicht, dass sie in einer Warteschlange, d. h. nacheinander, animiert werden. Ich möchte, dass sie gleichzeitig anfangen zu animieren und gleichzeitig zu beenden!
Sie können sie einfach nacheinander ausführen:
%Vor% Dies verwendet .hover() , um beim Hovering eine Richtung zu animieren, und animiert sie zurück wenn Verlassen. Die .stop() dient lediglich dazu, den Aufbau von Animationswarteschlangen zu verhindern. Um eine Farbe zu animieren, benötigen Sie entweder das Farb-Plug-in oder jQuery UI ebenfalls enthalten.
Animationen in jquery, .animate() , werden implementiert mit setInterval() mit einem 13ms-Timer, so dass sie außerhalb des normalen Ablaufs passieren ... tun sie wie oben warten nicht auf den ersten zu beenden, werden sie gleichzeitig laufen.
Lesen Sie jQuery.animate () . Es gibt queue Eigenschaft:
queue: Ein boolescher Wert, der angibt, ob die Animation in der Effekt-Warteschlange platziert werden soll. Wennfalse, beginnt die Animation sofort.
Es stimmt zwar, dass aufeinanderfolgende Aufrufe von animate das Aussehen haben, das sie gleichzeitig ausführen, aber die zugrunde liegende Wahrheit ist, dass es sich um unterschiedliche Animationen handelt, die sehr parallel zueinander verlaufen.
Um sicherzustellen, dass die Animationen tatsächlich gleichzeitig ausgeführt werden, verwenden Sie:
%Vor%Weitere Animationen können der "trigger-hover" -Warteschlange hinzugefügt werden und alle können gestartet werden, wenn die letzte Animation sie aus der Warteschlange entfernt.
Prost, Anthony
Tags und Links jquery jquery-ui jquery-animate