animationEndがanimationNameを介して起動したことを検出します

Question

複数のCSS3アニメーションが1つのdivにリンクされていますが、最後のアニメーションの最後のコールドにしか機能しません。

アニメーションエフェクトを使用して前記の機能をトリガーできるようにしましたが、私が言ったように、最後のアニメーションでのみ実行するようにしました。

animationEndイベントをトリガしたアニメーションの名前を確認して、アニメーションの検出方法が終了しましたか？

私は最後のアニメーションを取り除くためにifステートメントを使用できます。

Answer 1

このパラメータは、この機能を定義するときに必要です。いずれもうまくいくはずです。

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

あるいは、

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

Answer 2

なぜ私にはわからない...しかし、私は唯一のe.originalEvent.animationName

でanimationNameをキャッチすることができますので、最良のオプションは次のとおりです。

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