événement de début d'animation
Exemple
Faites quelque chose avec un élément <div> lorsqu'une animation CSS a commencé :
var x = document.getElementById("myDIV");
// Code for Chrome, Safari and Opera
x.addEventListener("webkitAnimationStart", myStartFunction);
// Standard syntax
x.addEventListener("animationstart", myStartFunction);
Définition et utilisation
L'événement animationstart se produit lorsqu'une animation CSS a commencé à jouer.
Pour plus d'informations sur les animations CSS, consultez notre tutoriel sur les animations CSS3 .
Lors de la lecture d'une animation CSS, trois événements peuvent se produire :
- animationstart - se produit lorsque l'animation CSS a démarré
- animationiteration - se produit lorsque l'animation CSS est répétée
- animationend - se produit lorsque l'animation CSS est terminée
Prise en charge du navigateur
Les nombres dans le tableau indiquent la première version du navigateur qui prend entièrement en charge l'événement.
Les nombres suivis de "webkit" ou "moz" spécifient la première version qui a fonctionné avec un préfixe.
| Event | |||||
|---|---|---|---|---|---|
| animationstart | 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 webkitAnimationStart.
Syntaxe
object.addEventListener("webkitAnimationStart", myScript); // Code for Chrome, Safari and Opera
object.addEventListener("animationstart", myScript); // Standard syntax
Remarque : La méthode addEventListener() n'est pas prise en charge dans Internet Explorer 8 et les versions antérieures.
Détails techniques
| Bulles: | Oui |
|---|---|
| Annulable : | Non |
| Type d'événement: | AnimationÉvénement |
| Version DOM : | Événements de niveau 3 |
Pages connexes
Tutoriel CSS : Animations CSS3
Référence CSS : Propriété d'animation CSS3
Référence HTML DOM : Propriété d'animation de style