例
做一個東西<div>元素時，CSS動畫已經開始：
var x = document.getElementById("myDIV");
// Code for Chrome, Safari
and Opera
x.addEventListener("webkitAnimationStart", myStartFunction);
//
Standard syntax
x.addEventListener("animationstart", myStartFunction); 試一試» 定義和用法
當CSS動畫已經開始玩時發生animationstart事件。
有關CSS動畫的更多信息，請參閱我們的教程CSS3動畫 。
當CSS動畫播放，有可能會發生三個事件：
- animationstart - 當CSS動畫已經開始出現
- animationiteration -當重複CSS動畫時
- animationend -當CSS動畫完成時
瀏覽器支持
在表中的數字規定，完全支持該事件的第一個瀏覽器版本。
數字其次是"webkit"或"moz"指定的前綴工作的第一個版本。
| 事件 | |||||
|---|---|---|---|---|---|
| animationstart | 4.0的WebKit | 10.0 | 16.0 5.0萬盎司 | 4.0的WebKit | 15.0的WebKit 12.1 |
注意：使用Chrome，Safari和Opera，使用webkitAnimationStart前綴。
句法
object.addEventListener("webkitAnimationStart", myScript );
// Code for Chrome, Safari and Opera
object .addEventListener("animationstart", myScript );
// Standard syntax
注意： addEventListener()在Internet Explorer 8和更早版本不支持的方法。
技術細節
| 泡沫： | 是 |
|---|---|
| 取消： | 沒有 |
| 事件類型： | AnimationEvent |
| DOM版本： | 3級事件 |
相關頁面
CSS教程： CSS3動畫
CSS參考： CSS3 animation Property
HTML DOM參考： Style animation Property
<事件對象