Propriété AnimationEvent elapsedTimeAnimationEvent elapsedTime Property
Exemple
Découvrez combien de secondes une animation a duré :
var x = document.getElementById("myDIV");
x.addEventListener("animationiteration", myRepeatFunction);
function myRepeatFunction(event) {
this.innerHTML = "Elapsed time: " + event.elapsedTime;
}
Définition et utilisation
La propriété elapsedTime renvoie le nombre de secondes d'exécution d'une animation lorsqu'un événement d'animation se produit.
Remarque : La valeur de retour n'est pas affectée si l'animation est mise en pause (en utilisant la propriété CSS animation-delay).
Remarque : Pour l' événement animationstart , cette propriété renvoie toujours "0".
Cette propriété est en lecture seule.
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é.
Property | |||||
---|---|---|---|---|---|
elapsedTime | Yes | 10.0 | 6.0 | Yes | Yes |
Syntaxe
event.elapsedTime
Détails techniques
Valeur de retour : | Un nombre, représentant le nombre de secondes pendant lesquelles une animation a été exécutée |
---|
Pages connexes
Référence HTML DOM : l'événement animationstart
Référence HTML DOM : l'événement animationiteration
Référence HTML DOM : l'événement animationend
Référence HTML DOM : AnimationEvent animationName Property
Référence CSS : Propriété d'animation CSS3
Référence CSS : Propriété CSS3 animation-duration