Animation.pause()

El método pause() de la interfaz Animation de la Web Animations API (en-US), suspende la reproducción de la animación.

Sintaxis

animation.pause();

Parámetros

Ningun.

Valor devuelto

Ningun.

Excepciones

InvalidStateError

La animación currentTime no está resuelta unresolved (por ejemplo, si nunca se ha reproducido o no se está reproduciendo actualmente) y el tiempo de finalización de la animación es infinito positivo.

Lanza un InvalidStateError si el currentTime de la animación no está resuelto unresolved (tal vez no se haya iniciado la reproducción) y el fin de la animación es infinito positivo.

Ejemplos

Animation.pause() es utilizado en varias ocasiones en el juego Alice in Web Animations API Land Growing/Shrinking Alice Game, porque las animaciones creadas con el método Element.animate() se inician de inmediato y deben ser detenidas manualmente para evitar esto:

// animación de la magdalena que lentamente se está comiendo
var nommingCake = document.getElementById('eat-me_sprite').animate(
[
  { transform: 'translateY(0)' },
  { transform: 'translateY(-80%)' }
], {
  fill: 'forwards',
  easing: 'steps(4, end)',
  duration: aliceChange.effect.timing.duration / 2
});

// realmente solo debe funcionar al hacer click, así que se pausa inicialmente:
nommingCake.pause();

Adicionalmente, al restablecer:

// Una función multiusos para pausar las animaciones de Alicia, el pastelito y la botella que dice "drink me."
var stopPlayingAlice = function() {
  aliceChange.pause();
  nommingCake.pause();
  drinking.pause();
};

// Cuando el usuario suelte el cupcake o la botella, pause las animaciones.
cake.addEventListener("mouseup", stopPlayingAlice, false);
bottle.addEventListener("mouseup", stopPlayingAlice, false);

Especificaciones

Specification
Unknown specification
# dom-animation-pause

Compatibilidad con navegadores

BCD tables only load in the browser

Ver también