Exemple
Faire quelque chose avec un <div> élément lorsqu'une transition CSS a pris fin:
// Code for Safari 3.1 to 6.0
document.getElementById("myDIV").addEventListener("webkitTransitionEnd",
myFunction);
// Standard syntax
document.getElementById("myDIV").addEventListener("transitionend",
myFunction); Essayez - le vous - même » Définition et utilisation
L'événement se produit transitionend lorsqu'une transition CSS est terminée.
Remarque: Si la transition est retirée avant la fin, par exemple si le CSS transition-propriété propriété est supprimée, l'événement transitionend ne se déclenche pas.
Pour plus d' informations sur CSS Transitions, consultez notre tutoriel sur CSS3 Transitions .
support du navigateur
Les chiffres du tableau indiquent la première version du navigateur qui soutient pleinement l'événement.
Numbers suivi par "webkit", "moz" ou "o" spécifient la première version qui a travaillé avec un préfixe.
| un événement | |||||
|---|---|---|---|---|---|
| transitionend | 26,0 4,0 (webkitTransitionEnd) | 10.0 | 16,0 4,0 (mozTransitionEnd) | 6.1 3.1 (webkitTransitionEnd) | 12.1 10.5 (oTransitionEnd) |
Syntaxe
object.addEventListener("webkitTransitionEnd", myScript );
// Code for Safari 3.1 to 6.0
object .addEventListener("transitionend", myScript );
// Standard syntax
Remarque: Le addEventListener () méthode est pas prise en charge dans Internet Explorer 8 et les versions antérieures.
Détails techniques
| Bulles: | Oui |
|---|---|
| Annulable: | Oui |
| Type d'événement: | TransitionEvent |
| DOM Version: | Niveau 3 Événements |
Pages associées
Tutoriel CSS: CSS3 Transitions
CSS Référence: CSS3 transition de la propriété
CSS Référence: CSS3 transition-propriété de la propriété
Objet de l' événement