Propriété CSS animation-delay
Exemple
Démarrez l'animation après 2 secondes :
div {
animation-delay: 2s;
}
Plus d'exemples "Essayez-le vous-même" ci-dessous.
Définition et utilisation
La animation-delay
propriété spécifie un délai pour le démarrage d'une animation.
La valeur du délai d'animation est définie en secondes (s) ou en millisecondes (ms).
Valeur par défaut: | 0s |
---|---|
Hérité: | non |
Animable : | non. En savoir plus sur l'animation |
Version: | CSS3 |
Syntaxe JavaScript : | objet .style.animationDelay="1s" |
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-delay | 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-delay: time|initial|inherit;
Valeurs de propriété
Value | Description | Play it |
---|---|---|
time | Optional. Defines the number of seconds (s) or milliseconds (ms) to wait before the animation will start. Default value is 0. Negative values are allowed. If you use negative values, the animation will start as if it had already been playing for N seconds/milliseconds. | |
initial | Sets this property to its default value. Read about initial | |
inherit | Inherits this property from its parent element. Read about inherit |
Plus d'exemples
Exemple
Utilisation de valeurs négatives. Ici, l'animation commencera comme si elle avait déjà joué pendant 2 secondes :
div {
animation-delay: -2s;
}
Pages connexes
Tutoriel CSS : Animations CSS
Référence HTML DOM : propriété animationDelay