Animation: cancel イベント
Baseline
広く利用可能
この機能は広く実装されており、多くのバージョンの端末やブラウザーで動作します。2020年3月以降、すべてのブラウザーで利用可能です。
cancel は Animation インターフェイスのイベントで、Animation.cancel() メソッドが呼び出された時や、アニメーションの再生が完了する前に要素から除去された時など、アニメーションが他の状態から "idle" 再生状態になった時に発行されます。
メモ:
最初からアイドル状態で新しいアニメーションを作成しても、新しいアニメーションの cancel イベントは発生しません。
構文
このイベント名を addEventListener() などのメソッドで使用するか、イベントハンドラープロパティを設定するかしてください。
js
addEventListener("cancel", (event) => { })
oncancel = (event) => { }
イベント型
AnimationPlaybackEvent です。 Event から継承しています。
イベントプロパティ
以下に挙げたプロパティに加え、親インターフェイスである Event から継承したプロパティが利用できます。
AnimationPlaybackEvent.currentTime読取専用-
イベントを生成したアニメーションの現在時刻。
AnimationPlaybackEvent.timelineTime読取専用-
イベントを生成したアニメーションのタイムラインの時刻値。
例
アニメーションがキャンセルされた場合、それを要素から除去します。
js
animation.oncancel = (event) => {
animation.effect.target.remove();
};
仕様書
| 仕様書 |
|---|
| Web Animations # dom-animation-oncancel |
| Web Animations # cancel-event |