Animation.ready

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 de solo-lectura Animation.ready de la Web Animations API devuelve un Promise que se resuelve cuando la animación está lista para reproducirse. Una nueva 'promesa' es creada cada vez que la animación entra en play state(estado de reproducción) "pending"(pendiente) así como si la reproducción es cancelada, ya que en ambos escenarios, la animación estará lista para ser reiniciada.

Nota: Dado que la misma Promise es usada para las solicitudes pendientes de play y pause , se recomienda a los autores que comprueben el estado de la animación cuando se resuelva la promesa.

Sintaxis

js
var readyPromise = Animation.ready;

Valor

Un Promise que se resuelve cuando la animación esta lista para reproducirse. Por lo general, se usará una construcción similar a esta usando una promise lista:

js
animation.ready.then(function () {
  // Hace lo que sea necesario cuando
  // la animación está lista para reproducirse
});

Ejemplo

En el siguiente ejemplo, el estado de la animación será running(reproduciendo) cuando la Promise actual se resuelva ya que la animación no deja el estado de reproducción pending entre las llamadas pause and play ,por lo tanto, la Promise actual no cambia.

js
animation.pause();
animation.ready.then(function () {
  // Displays 'running'
  alert(animation.playState);
});
animation.play();

Especificaciones

Specification
Web Animations
# dom-animation-ready

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
ready

Legend

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

Full support
Full support

Ver también