animationend 事件
示例
在 CSS 動畫結束後執行某些操作
const div1 = document.getElementById("myDIV");
div1.addEventListener("animationend", myEndFunction);
自己動手試一試 »
描述
當 CSS 動畫完成時,會觸發 animationend
事件。
動畫事件
事件 | 發生時間 |
---|---|
animationstart | CSS 動畫已開始 |
animationend | CSS 動畫已完成 |
animationiteration | CSS 動畫重複播放 |
動畫屬性
屬性 | 描述 |
---|---|
animationName | 動畫的名稱 |
elapsedTime | 動畫已執行的秒數 |
pseudoElement | 動畫的偽元素的名稱 |
另請參閱
教程
技術詳情
冒泡 | 是 |
---|---|
可取消 | 否 |
事件型別 | AnimationEvent |
DOM 版本 | Level 3 Events |
瀏覽器支援
onanimationend
是 DOM Level 3 (2004) 功能。
所有現代瀏覽器都完全支援它
Chrome | Edge | Firefox | Safari | Opera | IE |
是 | 是 | 是 | 是 | 是 | 11 |