Große Animations-Engines für Javascript? - Javascript/Animationen

Question

Ich versuche, eine Timeline-basierte Animation zu implementieren, wo Animationen in der Lage zu sein:

• pausiert
• wieder
• pult
• verlangsamt
• umgekehrt
• ...

Gibt es Animations-/Tweening-Engines für Javascript, die für diesen Zweck verwendet werden könnten? Oder das wäre sehr zu empfehlen?

---

Hwlp wäre großartig, vor allem, weil das mich wirklich interessiert! =)

Answer 1

Ich denke, alle diese Rahmenbedingungen wird das für Sie tun (Reverse wird nicht von allen von ihnen unterstützten ich sehe):

• jQuery: http://api.jquery.com/animate/
• $ fx: http://fx.inetcat.com/manuals.php
• Scriptaculous: http://wiki.github.com/madrobby/scriptaculous/
• Yahoo! UI-Bibliothek: http://developer.yahoo.com/yui/3/api/module_anim.html

Ich bevorzuge jQuery.

Answer 2

Versuchen zu verwenden Yahoo UI:

http://developer.yahoo.com/yui/3/examples/

Blick auf Animation, Schnitt.

Answer 3

Sie einen Blick auf jQuery animieren nehmen

http://www.visualjquery.com/

in das Suchfeld schreiben „animieren“ auf Element klicken und Sie werden einige Beispiele dort zu sehen.

Answer 4

Ich glaube nicht, wonach Sie suchen, Sie sollten es selbst schreiben.

Auch ich denke, dass Adobe mit einer Reihe von Tools für JS/HTML/CSS-Animationen kommt, können Sie ihre Präsentation bei Google IO überprüfen.

Answer 5

Ich weiß nicht, ob Sie immer noch interessiert sind, aber ich suche das gleiche wie Sie (glaube mir, ich suche Stunden und Stunden), und ich weiß nicht, ob ich wirklich gefunden habe wonach ich gesucht habe. Der nächste ist jsAnim (http://jsanim.com) und es funktioniert ok für jetzt. Ich habe eine Liste von dem, was ich im Internet gefunden habe:

(Kommentare sind sehr unpersönlich und Tests wurden sehr schnell gemacht. Bitte nehmen Sie es mit einer Pinzette.)

• jsAnim: Syntax ist sehr einfach, auf Animation zu konzentrieren und nicht auf Objektarchitektur (siehe YUI) (das ist toll ... für Ingenieure ...). Easing-Optionen sind nicht toll, aber nett. Alles in allem funktioniert gut.
• Scripty2 (ehemalige Script.aculo.us): nicht für erforderlich Prototyp getestet.
• moo.fx: Nicht getestet für die Verwendung von Prototype oder Mootools.
• YUI 2/3 Animation: ok gearbeitet, aber es ist Ingenieur Code hat eine hohe Lernkurve für eine ungezwungene Front-End-Animation.
• $ fx(): Hat eine sehr-ultra-kleine Stellfläche (nur 3 KB!). Wäre die Wahl wenn nur erleichtert hätte.
• Trident-js: Scheint eine sehr mächtige Zeitleiste zu haben und sieht gut aus auf den Demos, aber es hat für mich überhaupt nicht funktioniert und es ist dünn Dokumentation hilft nicht viel.
• Animator.js: Syntax erschrocken mich. Sah mir auch sehr amateurhaft aus.
• JSTweener/GX/xAnimation: Diejenigen, hat meine Aufmerksamkeit sogar ein wenig nicht erfasst. Es schien mir sehr amateurhaft.
• Glimmer GUI für jQuery Code-Generierung:-Setup nicht auf meinem Rechner (Installateurs unbekannter Fehler) installiert.
• Raphael/Burst Motor/Processing.js/Pixastic/Kuchen-js: Sie sind für die Leinwand/Vektoren. Eine andere Art von (coolem) Zeug.
• Sprich: Auch für eine andere Art von Dingen: Sprites Animation.

So ist der Gewinner, denn jetzt und für meine aktuellen Animations Anforderungen ist jsAnim. Ich möchte auch Scripta2 und moo.fx versuchen, da sie seit einiger Zeit zu sein scheinen (beide von 2005, Script2 ist die zweite Version von Script.acoulo.us).

Meine 2cents. Hoffe es hilft jemandem. Nun Gott, ich will meine letzten 8 Stunden zurück !!!

Answer 6

Ich schlage vor, BetweenJS eine Cross-Browser-portage von BetweenAS3 für Javascript, wo alles u gefragt implementiert und bereit http://github.com/sazaam/BetweenJS/

Answer 7

für ein komplettes Feature-Set verwenden Besuche KUTE.js. Es bietet Transformation, Box-Modell-Eigenschaften, Scroll-, Präsentations-Attribute, SVG-Morph, SVG-Zeichnen, Tween-Sammlungen, Pause und eine Menge Beschleunigungsfunktionen.