轻松上手,快乐学习!

TransitionEvent elapsedTime 属性


❮ DOM 事件 ❮ TransitionEvent

实例

确定过渡运行了多少秒:

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

function myFunction(event) {
  this.innerHTML = "Transition lasted: " + event.elapsedTime + " seconds";
}
亲自试一试 »

定义和用法

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

注释:如果过渡暂停(通过使用 CSS 属性 transition-delay),则返回值不受影响。

注释:该属性是只读的。


浏览器支持

表中的数字表示支持该属性的第一个浏览器版本。

属性
elapsedTime Yes 10.0 Yes Yes Yes

语法

event.elapsedTime

技术细节

返回值: 数字值,表示过渡已运行的秒数。

相关页面

HTML DOM 参考手册: The transitionend 事件

HTML DOM 参考手册: TransitionEvent propertyName 属性

CSS 参考手册: CSS3 transition 属性

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


❮ DOM 事件 ❮ TransitionEvent