例
做一些与<div>元素时重复一个CSS动画：
var x = document.getElementById("myDIV");
// Code for Chrome, Safari and Opera
x.addEventListener("webkitAnimationIteration", myRepeatFunction);
//
Standard syntax
x.addEventListener("animationiteration",
myRepeatFunction); 试一试» 定义和用法
当重复CSS动画时发生animationiteration事件。
如果CSS animationiteration数属性设置为"1" ，这意味着动画将只在一个时间出场，不会发生animationiteration事件。 动画需要运行一次以上此事件激发。
有关CSS动画的更多信息，请参阅我们的教程CSS3动画 。
当CSS动画播放，有可能会发生三个事件：
- animationstart -当CSS动画已经开始出现
- animationiteration - 当重复CSS动画时
- animationend -当CSS动画完成时
浏览器支持
在表中的数字规定，完全支持该事件的第一个浏览器版本。
数字其次是"webkit"或"moz"指定的前缀工作的第一个版本。
| 事件 | |||||
|---|---|---|---|---|---|
| animationiteration | 4.0的WebKit | 10.0 | 16.0 5.0万盎司 | 4.0的WebKit | 15.0的WebKit 12.1 |
注意：使用Chrome，Safari和Opera，使用webkitAnimationIteration前缀。
句法
object.addEventListener("webkitAnimationIteration", myScript );
// Code for Chrome, Safari and Opera
object .addEventListener("animationiteration", myScript );
// Standard syntax
注意： addEventListener()在Internet Explorer 8和更早版本不支持的方法。
技术细节
| 泡沫： | 是 |
|---|---|
| 取消： | 没有 |
| 事件类型： | AnimationEvent |
| DOM版本： | 3级事件 |
相关页面
CSS教程： CSS3动画
CSS参考： CSS3 animation Property
CSS参考： CSS3 animation-iteration-count Property
HTML DOM参考： Style animation Property
<事件对象