animationstart Evento

Exemplo

Faça algo com um <div> elemento quando uma animação CSS começou:

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

// Code for Chrome, Safari and Opera
x.addEventListener("webkitAnimationStart", myStartFunction);

// Standard syntax
x.addEventListener("animationstart", myStartFunction);

Tente você mesmo "

Definição e Uso

O evento animationstart ocorre quando uma animação CSS começou a jogar.

Para mais informações sobre CSS animações, consulte o nosso tutorial sobre CSS3 animações .

Quando uma animação CSS desempenha, há três eventos que podem ocorrer:

animationstart - ocorre quando a animação CSS começou
animationiteration - ocorre quando a animação CSS é repetido
animationend - ocorre quando a animação CSS completou

Suporte navegador

Os números na tabela especificar a primeira versão do navegador que suporta totalmente o evento.

Números seguido por "webkit" ou "moz" especificar a primeira versão que trabalhou com um prefixo.

Evento
animationstart	4.0 webkit	10.0	16,0 5.0 Moz	4.0 webkit	15,0 -webkit 12.1

Nota: Para Chrome, Safari e Opera, utilize o prefixo webkitAnimationStart.

Sintaxe

object.addEventListener("webkitAnimationStart", myScript ); // Code for Chrome, Safari and Opera
object .addEventListener("animationstart", myScript ); // Standard syntax

Nota: O addEventListener() método não é suportado no Internet Explorer 8 e versões anteriores.