animation-fill-mode legt fest, ob die animation am Ende zurückspringt (backwards – die Vorgabe) oder mit den Eigenschaften des letzten Keyframes endet (forwards).

Ohne spezielles auslösendes Event (z.B. hover oder focus) starten CSS-Keyframes-Animationen automatisch, wenn das Dokument im Browserfenster geladen wird.

Beispiele für einfache, responsive CSS Keyframes-Animationen ohne Javascript und ohne :hover … endloses Panorama und Schneekugel. CSS Keyframes sparen viele Zeilen Javascript.

animation-play-state, -fill-mode und -direction steuern CSS-animationen und legen fest, ob die animation am Ende zurückspringt oder mit den Eigenschaften des letzten Keyframes endet.

Animationen steuern, in Abhängigkeit voneinander zu starten: pausieren, canceln, das Ende einer Animation erkennen mit finish().

requestAnimationFrame ruft die Animations-Funktion vor jedem erneuten Rendern (Refresh) des Browserfensters auf – effizienter als setTimeout oder setInterval.

SMIL-Animationen synchronisieren sich anhand von Aktionen wie click und mouseover und eine Animation kann den Start einer weiteren Animation triggern.

Javascript animate() lehnt sich an CSS-Keyframe-Animationen an und borgt sich CSS-Eigenschaften und -Optionen wie duration und easing.

animation-delay bewirkt eine Verzögerung vor dem Start einer animation in Sekunden, aber keine Verzögerung zwischen wiederholten Durchläufen einer animation.

jQuery animate vereinfacht komplexe Animationen. show (), hide (), slideDown () und slideUp () sind einfache Effekte aus jQuery.