Propriété CSS animation-play-state
Exemple
Mettre une animation en pause :
div {
animation-play-state: paused;
}
Plus d'exemples "Essayez-le vous-même" ci-dessous.
Définition et utilisation
La animation-play-state
propriété spécifie si l'animation est en cours d'exécution ou en pause.
Remarque : Utilisez cette propriété dans un JavaScript pour suspendre une animation au milieu d'un cycle.
Valeur par défaut: | fonctionnement |
---|---|
Hérité: | non |
Animable : | non. En savoir plus sur l'animation |
Version: | CSS3 |
Syntaxe JavaScript : | objet .style.animationPlayState="mis en pause" |
Prise en charge du navigateur
Les nombres dans le tableau indiquent la première version du navigateur qui prend entièrement en charge la propriété.
Les nombres suivis de -webkit-, -moz- ou -o- spécifient la première version qui a fonctionné avec un préfixe.
Property | |||||
---|---|---|---|---|---|
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- |
Syntaxe CSS
animation-play-state: paused|running|initial|inherit;
Valeurs de propriété
Value | Description | Play it |
---|---|---|
paused | Specifies that the animation is paused | |
running | Default value. Specifies that the animation is running | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Pages connexes
Tutoriel CSS : Animations CSS
Référence HTML DOM : propriété animationPlayState
Plus d'exemples
Exemple
Mettre en pause une animation au survol :
div:hover {
animation-play-state: paused;
}