Événement animationiteration

Exemple

Faire quelque chose avec un <div> élément lors d' une animation CSS se répète:

var x = document.getElementById("myDIV");

// Code for Chrome, Safari and Opera
x.addEventListener("webkitAnimationIteration", myRepeatFunction);

// Standard syntax
x.addEventListener("animationiteration", myRepeatFunction);

Essayez vous - même »

Définition et utilisation

L'événement animationiteration se produit lorsqu'une animation CSS est répété.

Si le CSS animationiteration comptage propriété est définie sur "1" , ce qui signifie que l'animation ne sera joué une fois, l'événement animationiteration ne se produit pas. L'animation doit fonctionner plus d'une fois pour cet événement au feu.

Pour plus d' informations sur CSS Animations, consultez notre tutoriel sur animations CSS3 .

Quand une animation CSS joue, il y a trois événements qui peuvent se produire:

animationstart - se produit lorsque l'animation CSS a commencé
animationiteration - se produit lorsque l'animation CSS est répété
animationend - se produit lorsque l'animation CSS a terminé

Support du navigateur

Les chiffres du tableau indiquent la première version du navigateur qui soutient pleinement l'événement.

Les chiffres suivis par "webkit" ou "moz" précisent la première version qui a travaillé avec un préfixe.

un événement
animationiteration	4.0 webkit	10.0	16,0 5.0 moz	4.0 webkit	15,0 webkit 12.1

Remarque: Pour Chrome, Safari et Opera, utilisez le préfixe webkitAnimationIteration.

Syntaxe

object.addEventListener("webkitAnimationIteration", myScript ); // Code for Chrome, Safari and Opera
object .addEventListener("animationiteration", myScript ); // Standard syntax

Note: Le addEventListener() méthode est pas prise en charge dans Internet Explorer 8 et les versions antérieures.