AnimationEvent インターフェイス
AnimationEvent インターフェイスは、CSSアニメーションにおけるイベントに関する Event インターフェイスです。
- Event
- └── AnimationEvent
Event インターフェイスを継承しています。Event インターフェイスの Property と Method が使えます。
ページ内 Index
プロパティ(Properties)
以下は AnimationEvent インターフェイスのプロパティです。
Property | |
---|---|
animationName | CSSアニメーション名 |
elapsedTime | CSSアニメーションが実行された秒数 |
pseudoElement | CSS アニメーションが実行されている疑似エレメントを取得。疑似エレメントでCSS アニメーションが実行されている場合のみ |
Event インターフェイスから継承された プロパティも利用できます。
AnimationEvent インターフェイスのプロパティは以下のように使用します。
var boole = event.bubbles; var animation_name = event.animationName;
メソッド(Methods)
独自のメソッドはありません。
イベント(Event)
AnimationEvent のイベントは、CSS アニメーションを定義したエレメントに設定します。
AnimationEvent に関するイベントには以下があります。
animationcancel ( onanimationcancel ) | CSS アニメーションが中断されたら |
animationend ( onanimationend ) | CSS アニメーションが終了したら |
animationiteration ( onanimationiteration ) | CSS アニメーションが一通り再生したら |
animationstart ( onanimationstart ) | CSS アニメーションが開始したら |
以下はイベントの使用方法の例です。
in HTML
<tagelement onanimationstart="oneFunction()">
in JavaScript
object.onanimationstart = function(){ }; object.addEventListener("animationstart", script_);