Rileva quale AnimationEnd è stato attivato tramite animationName

Question

Ho diverse animazioni CSS3 collegate a un div, ma voglio solo una funzione per essere callad alla fine dell'ultima animazione.

Ho utilizzato l'evento animationEnd in modo che possa attivare la funzione, ma come ho detto, desidero che venga eseguita solo nell'ultima animazione.

C'è un modo per rilevare con l'animazione è terminato controllando il nome dell'animazione che ha attivato l'evento animationEnd?

mi consente quindi di utilizzare un'istruzione if per individuare l'ultima animazione.

Answer 1

Il parametro è necessario quando si definisce la funzione. Ognuno di questi dovrebbe funzionare;

var $element = $('.eye').bind("webkitAnimationEnd oAnimationEnd msAnimationEnd animationend", function(event){ 
    if (event.originalEvent.animationName === "three") { 
     console.log('the event happened'); 
    } 
} 

Oppure,

var $element = $('.eye').bind("webkitAnimationEnd oAnimationEnd msAnimationEnd animationend", function(e){ 
    if (e.originalEvent.animationName === "three") { 
     console.log('the event happened'); 
    } 
} 

Answer 2

Non so perchè ... ma posso prendere il l'animationName solo da e.originalEvent.animationName

quindi l'opzione migliore è:

function getAnimationName(e) { 
    if(e.animationName != undefined) return e.animationName; 
    if(e.originalEvent.animationName != undefined) return e.originalEvent.animationName; 
    else return undefined; 
}