Beispiel
Pause eine Animation:
div
{
-webkit-animation-play-state: paused; /* Chrome, Safari, Opera */
animation-play-state: paused;
} Versuch es selber " Mehr "Try it Yourself" Sie "Try it Yourself" Beispiele unten.
Definition und Verwendung
Die Animation-Play-State-Eigenschaft gibt an, ob die Animation oder pausiert läuft.
Note: Verwenden Sie diese Eigenschaft in einem JavaScript eine Animation in der Mitte eines Zyklus zu unterbrechen.
| Standardwert: | running |
|---|---|
| Vererbt: | no |
| Anima: | no. Read about animatable |
| Version: | CSS3 |
| JavaScript-Syntax: | object .style.animationPlayState="paused" Try it |
Browser-Unterstützung
Die Zahlen in der Tabelle geben Sie die erste Browser-Version, die die Eigenschaft vollständig unterstützt.
Zahlen, gefolgt von -webkit-, -moz- oder -o- die erste Version an, die mit einem Präfix gearbeitet.
| Eigentum | |||||
|---|---|---|---|---|---|
| animation-play-state | 43.0 4.0 -webkit- | 10.0 | 16.0 5,0 -moz- | 9.0 4.0 -webkit- | 30.0 15,0 -webkit- 12.0 -o- |
CSS-Syntax
animation-play-state: paused|running|initial|inherit;Eigenschaftswerte
| Wert | Beschreibung | Spiel es |
|---|---|---|
| paused | Gibt an, dass die Animation angehalten wird | Spiel es " |
| running | Standardwert. Gibt an, dass die Animation läuft | Spiel es " |
| initial | Setzt diese Eigenschaft auf den Standardwert. Lesen Sie mehr über Anfangs | |
| inherit | Erbt diese Eigenschaft von seinem übergeordneten Element. Lesen Sie mehr über erben |
Verwandte Seiten
CSS3 Tutorial: CSS3 Animationen
HTML - DOM - Referenz: animationPlayState property
Mehr Beispiele
Beispiel
Pause eine Animation auf schweben:
div:hover {
-webkit-animation-play-state: paused; /*
Chrome, Safari, Opera */
animation-play-state: paused;
}
Versuch es selber "