Animation.currentTime

Baseline Widely available

This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2020.

La propiedad Animation.currentTime de la Web Animations API devuelve y establece el valor del tiempo de la animación en milisegundos, tanto si se está ejecutando como en pausa.

Si la animación carece de un timeline, está inactiva, o no ha sido reproducida todavía, el valor devuelto por currentTime es null.

Sintaxis

js
var currentTime = Animation.currentTime;
Animation.currentTime = newTime;

Valor

Un número que representa el tiempo actual en milisegundos, o null para desactivar la animación.

Ejemplos

En el juego Drink Me/Eat Me, la altura de Alicia está animada, por lo que puede cambiar de pequeña a grande y de grande a pequeña. Al inicio del juego, su altura de fija estableciendo el currentTime (tiempoActual) a la mitad de la duración total delKeyframeEffect:

js
aliceChange.currentTime = aliceChange.effect.timing.duration / 2;

Un modo más genérico para encontrar la marca del 50% en una animación sería :

js
animation.currentTime =
  animation.effect.getComputedTiming().delay +
  animation.effect.getComputedTiming().activeDuration / 2;

Especificaciones

Specification
Web Animations
# dom-animation-currenttime

Compatibilidad con navegadores

Report problems with this compatibility data on GitHub
desktopmobile
Chrome
Edge
Firefox
Opera
Safari
Chrome Android
Firefox for Android
Opera Android
Safari on iOS
Samsung Internet
WebView Android
WebView on iOS
currentTime

Legend

Tip: you can click/tap on a cell for more information.

Full support
Full support

Ver también