Evento animationend

Eventi DOM Evento AnimationEvent

Definizione e uso

Si verifica l'evento animationend quando l'animazione CSS è completata.

Per ulteriori informazioni sull'animazione CSS, esplora i nostri Tutorial di animazione CSS3.

Quando l'animazione CSS è in riproduzione, possono verificarsi tre eventi:

Esempio

Quando l'animazione CSS termina, fai qualcosa con l'elemento <div>:

var x = document.getElementById("myDIV");
// Codice per Chrome, Safari e Opera
x.addEventListener("webkitAnimationEnd", myEndFunction);
// Sintassi standard
x.addEventListener("animationend", myEndFunction);

Prova tu stesso

Sintassi

oggetto.addEventListener("webkitAnimationEnd", myScript);  // Codice per Chrome, Safari e Opera
oggetto.addEventListener("animationend", myScript);        // Sintassi standard

Nota:Internet Explorer 8 e versioni precedenti non supportano Metodo addEventListener().

Dettagli tecnici

Bubble: Supportato
Cancellabile: Non supportato
Tipo di evento: Evento AnimationEvent
Versione DOM: Eventi Livello 3

Supporto browser

I numeri nella tabella indicano la versione del browser che supporta completamente l'evento.

Il "webkit" o "moz" dopo il numero indica la versione iniziale del prefisso utilizzato.

Evento Chrome IE Firefox Safari Opera
animationend 4.0 webkit 10.0 16.0
5.0 moz		 4.0 webkit 15.0 webkit
12.1

Nota:Per Chrome, Safari e Opera, utilizzare webkitAnimationEnd.

Pagine correlate

Tutorial CSS:Animazione CSS3

Manuale di riferimento CSS:Proprietà animation CSS3

Manuale di riferimento HTML DOM:Proprietà animation Style

Eventi DOM Evento AnimationEvent