Derniers tutoriels de développement web
 

animationstart événement

<Object Event

Exemple

Faire quelque chose avec un <div> élément lors d' 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);
Essayez vous - même »

Définition et utilisation

L'événement animationstart se produit lorsqu'une animation CSS a commencé à jouer.

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
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

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


Détails techniques

Bulles: Oui
cancelable: Non
Type d'événement: AnimationEvent
DOM Version: Niveau 3 Évènements

Pages associées

Tutoriel CSS: CSS3 Animations

CSS Référence: CSS3 animation Property

Référence HTML DOM: Style animation Property


<Object Event