TransitionEvent elapsedTime 属性

DOM 事件 TransitionEvent

定义和用法

当发生 transitionend 事件时， elapsedTime 属性返回过渡已经运行的秒数。

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

注释：该属性只读。

实例

确定过渡运行了多少秒：

document.getElementById("myDIV").addEventListener("transitionend", myFunction);

function myFunction(event) {
  this.innerHTML = "Transition lasted: " + event.elapsedTime + " seconds";
}

亲自试一试

语法

event.elapsedTime

技术细节

返回值： 数字值，表示过渡已运行的秒数。

浏览器支持

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

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

相关页面

HTML DOM 参考手册：transitionend 事件

HTML DOM 参考手册：TransitionEvent propertyName 属性

CSS 参考手册：CSS3 transition 属性

CSS 参考手册：CSS3 transition-duration 属性

DOM 事件 TransitionEvent