Style animation Eigenschaft

Definition und Verwendung

animation Die Eigenschaft ist eine Abkürzung für sechs Animationseigenschaften:

Anmerkung:Definieren Sie immer animationDuration-EigenschaftAndernfalls beträgt die Dauer 0 und sie wird niemals abgespielt.

Beispiel

Verwenden Sie die Abkürzungseigenschaft, um die Animation des <div>-Elements zu ändern:

document.getElementById("myDIV").style.animation = "mynewmove 4s 2";

Probieren Sie es selbst aus

Syntax

Gibt den animation-Eigenschaftswert zurück:

object.style.animation

Setzen Sie den animation-Eigenschaftswert:

object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"

Eigenschaftswert

Wert Beschreibung
animationName Regelt den Namen der Schlüsselbilder, die auf den Selector gebunden werden sollen.
animationDuration Regelt, wie viele Sekunden oder Millisekunden die Animation dauert.
animationTimingFunction Regelt die Geschwindigkeitskurve der Animation.
animationDelay Regelt die Verzögerung vor dem Start der Animation.
animationIterationCount Regelt, wie oft die Animation abgespielt werden soll.
animationDirection Regelt, ob die Animation im Wechselzyklus umgekehrt abgespielt werden soll.
animationFillMode Regelt den Wert, der außerhalb der Ausführungszeit der Animation angewendet wird.
animationPlayState Regelt, ob die Animation laufend oder angehalten ist.
initial Setzt diesen Eigenschaftswert auf seinen Standardwert. Siehe initial.
inherit Erbt diesen Eigenschaftswert von seinem übergeordneten Element. Siehe inherit.

Technische Details

Standardwert: none 0 ease 0 1 normal none running
Rückgabewert: Zeichenkette, die den animation-Eigenschaft.
CSS-Version: CSS3

Browserunterstützung

animation ist eine CSS3 (1999) -Eigenschaft.

Es wird von allen Browsern vollständig unterstützt:

Chrome Edge Firefox Safari Opera IE
Chrome Edge Firefox Safari Opera IE
Unterstützt Unterstützt Unterstützt Unterstützt Unterstützt 11

Verwandte Seiten

CSS-Referenzhandbuch:animation-Eigenschaft