例
做一个东西<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
<事件对象