AnimationEvent elapsedTime 属性

DOM events AnimationEvent

定义和用法

elapsedTime 属性返回动画已运行的秒数，当一个动画事件发生时。

注释：如果动画暂停（通过使用 CSS 属性 animation-delay），则返回值不受影响。

注释：对于 animationstart event，此属性始终返回 "0"。

注释：该属性只读。

实例

确定动画运行了多少秒：

var x = document.getElementById("myDIV");
x.addEventListener("animationiteration", myRepeatFunction);
function myRepeatFunction(event) {
  this.innerHTML = "Elapsed time: " + event.elapsedTime;
}

亲自试一试

语法

event.elapsedTime

技术细节

返回值： 数字值，表示动画运行的秒数。

浏览器支持

表中的数字注明了完全支持该属性的首个浏览器版本。

属性 Chrome IE Firefox Safari Opera
elapsedTime 支持 10.0 6.0 支持 支持

相关页面

HTML DOM reference manual:animationstart event

HTML DOM reference manual:animationiteration event

HTML DOM reference manual:animationend event

HTML DOM reference manual:AnimationEvent animationName property

CSS reference manual:CSS3 animation property

CSS reference manual:CSS3 animation-duration property

DOM events AnimationEvent