animationstart 事件

事件對象參考手冊 事件對象

實例

在 CSS 動畫開始播放時為 <div> 元素添加監聽事件:

var x = document.getElementById("myDIV"); // Chrome, Safari 和 Opera 代碼 x.addEventListener("webkitAnimationStart", myStartFunction); // 標準語法 x.addEventListener("animationstart", myStartFunction);


定義和用法

animationstart 事件在 CSS 動畫開始播放時觸發。

更多關於 CSS 動畫的內容，請查看我們的 CSS3 動畫 章節。

CSS 動畫播放時，會發生以下三個事件：

流覽器支持

表格中的數字表示支持該事件的第一個流覽器的版本號。

"webkit" 或 "moz" 後面指定的數字為支持該事件的第一個版本號首碼。

事件
animationstart 4.0 webkit 10.0  16.0
5.0 moz		 4.0 webkit 15.0 webkit
12.1

注意： Chrome, Safari 和 Opera 流覽器使用 webkitAnimationEnd 首碼。

語法

object.addEventListener("webkitAnimationStart", myScript);  // Chrome, Safari 與 Opera 語法
object.addEventListener("animationstart", myScript);        // 標準語法

注意： Internet Explorer 8 及更早 IE 版本不支持 addEventListener() 方法。

技術細節
是否支持冒泡: Yes
是否可以取消: No
事件類型: AnimationEvent

相關頁面

CSS 教學: CSS3 動畫

CSS 參考手冊: CSS3 動畫屬性

HTML DOM 參考手冊: Style 動畫屬性


事件對象參考手冊 事件對象