最新的Web開發教程
 

animationiteration事件

<事件對象

做一些與<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動畫播放,有可能會發生三個事件:


瀏覽器支持

在表中的數字規定,完全支持該事件的第一個瀏覽器版本。

數字其次是"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


<事件對象