Propiedad elapsedTime del evento TransitionEvent

Eventos DOM TransitionEvent

Definición y uso

Al ocurrir Evento transitionendCuando, elapsedTime devuelve la cantidad de segundos que ha transcurrido la transición.

Notas:Si la transición se detiene (mediante la propiedad CSS transition-delay), el valor devuelto no se ve afectado.

Notas:Este atributo es de solo lectura.

Ejemplo

Determinar cuántos segundos duró la transición:

document.getElementById("myDIV").addEventListener("transitionend", myFunction);
function myFunction(event) {
  this.innerHTML = "La transición duró: " + event.elapsedTime + " segundos";
}

Prueba por tu cuenta

Sintaxis

event.elapsedTime

Detalles técnicos

Valor devuelto: Valor numérico, que representa la cantidad de segundos transcurridos durante la transición.

Compatibilidad del navegador

Los números en la tabla indican la primera versión del navegador que admite completamente el atributo.

Atributo Chrome IE Firefox Safari Opera
elapsedTime Soporte 10.0 Soporte Soporte Soporte

Páginas relacionadas

Manual de referencia del DOM HTML:Evento transitionend

Manual de referencia del DOM HTML:Propiedad propertyName del evento TransitionEvent

Manual de referencia de CSS:Atributo transition de CSS3

Manual de referencia de CSS:Atributo transition-duration de CSS3

Eventos DOM TransitionEvent