Latest web development tutorials

evento animationend

Evento de referencia de objetos Los objetos de evento

Ejemplos

Después se añade elemento de animación CSS para el final de la <div> detecta eventos:

var x = document.getElementById ( "myDiv");

// Códigos Chrome, Safari y Opera
x.addEventListener ( "webkitAnimationEnd", myStartFunction);

// Sintaxis estándar
x.addEventListener ( "animationend", myStartFunction);

Trate »

Definición y Uso

animationend evento se desencadena después de la animación CSS es completa.

Más acerca de la animación CSS, consulte nuestra animación CSS3 sección.

animación CSS juega, los siguientes tres eventos:

  • animationstart - después del inicio del gatillo animación CSS
  • animationiteration - la repetición de las animaciones CSS desencadenada
  • animationend - CSS desencadenó después de la finalización

Soporte para el navegador

Las cifras de la tabla representan el primer navegador para apoyar esta versión de los hechos.

"Webkit" o "moz" después de un número de prefijo especificado como la primera versión para apoyar el evento.

evento
animationend 4.0 webkit 10.0 16.0
5.0 MOZ 		4.0 webkit 15.0 webkit
12.1

Nota: Chrome, Safari y Opera webkitAnimationEnd prefijo.

gramática

object.addEventListener ( "webkitAnimationEnd", myScript) ; // Chrome, Safari y Opera
objetar .addEventListener ( "animationend", myScript ); // sintaxis estándar

Nota: Internet Explorer 8 y versiones anteriores de IE no son compatibles con addEventListener () método.

detalles técnicos
Ya sea para apoyar la burbuja: sí
Puede ser cancelada: no
Tipo de evento: AnimationEvent

Páginas relacionadas

CSS tutorial: Animación CSS3

CSS Referencia: propiedades de animación CSS3

HTML DOM Referencia: propiedades de animación Estilo


Evento de referencia de objetos Los objetos de evento