码农教程 - 一技在手,衣食无忧! tools

目录

TransitionEvent elapsedTime 属性

❮上一节 事件属性 下一节❯

示例

查看转换已经运行了多少秒：

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

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

描述

elapsedTime 属性返回转换已经运行的秒数，当过渡结束事件发生。

笔记：如果过渡暂停（通过使用过渡延迟 CSS 属性），返回值不会受到影响。

该属性是只读的。

语法

event.elapsedTime

技术细节

返回值： 一个数字，表示转换已运行的秒数

相关页面

HTML DOM 参考：过渡结束事件

HTML DOM 参考：TransitionEvent propertyName 属性

CSS 参考：CSS3 过渡属性

CSS 参考：CSS3 transition-duration 属性

浏览器支持

event.elapsedTime是 DOM Level 3 (2004) 功能。

所有现代浏览器都完全支持它：

Chrome Edge Firefox Safari Opera IE
Yes Yes Yes Yes Yes 11


❮上一节 事件属性 下一节❯