Attribut Style animation
- Page précédente alignSelf
- Page suivante animationDelay
- Retour au niveau supérieur Objet Style HTML DOM
Définition et utilisation
animation
Cet attribut est une abréviation des six attributs d'animation :
- animationName
- animationDuration
- animationTimingFunction
- animationDelay
- animationIterationCount
- animationDirection
Remarque :Définissez toujours Attribut animationDurationSinon, la durée est de 0 et elle ne joue jamais.
Exemple
Utilisez les attributs de raccourci pour modifier l'animation de l'élément <div> :
document.getElementById("myDIV").style.animation = "mynewmove 4s 2";
Syntaxe
Retourner les propriétés animation :
object.style.animation
Définir les propriétés animation :
object.style.animation = "name duration timingFunction delay iterationCount direction fillMode playState"
Valeur de l'attribut
Valeur | Description |
---|---|
animationName | Définit le nom des frames clés à lier au sélecteur. |
animationDuration | Définit le temps nécessaire à l'animation pour se terminer en secondes ou en millisecondes. |
animationTimingFunction | Définit la courbe de vitesse de l'animation. |
animationDelay | Définit le délai avant le début de l'animation. |
animationIterationCount | Définit le nombre de fois que l'animation doit être jouée. |
animationDirection | Définit si l'animation doit être jouée à l'envers dans une boucle alternée. |
animationFillMode | Définit la valeur appliquée en dehors du temps d'exécution de l'animation. |
animationPlayState | Définit si l'animation est en cours ou en pause. |
initial | Définit cette propriété à sa valeur par défaut. Voir aussi initial. |
inherit | Inherits cette propriété de son élément parent. Voir aussi inherit. |
Détails techniques
Valeur par défaut : | none 0 ease 0 1 normal none running |
---|---|
Valeur de retour : | Chaîne, représentant l'élément Propriétés animation. |
Version CSS : | CSS3 |
Support du navigateur
animation
C'est une fonctionnalité CSS3 (1999).
Tous les navigateurs le supportent pleinement :
Chrome | Edge | Firefox | Safari | Opera | IE |
---|---|---|---|---|---|
Chrome | Edge | Firefox | Safari | Opera | IE |
Support | Support | Support | Support | Support | 11 |
Pages associées
Manuel de référence CSS :Propriétés animation
- Page précédente alignSelf
- Page suivante animationDelay
- Retour au niveau supérieur Objet Style HTML DOM