Animation.pause()

Esta traducción está incompleta. Por favor, ayuda a traducir este artículo del inglés.

This is an experimental technology
Check the Browser compatibility table carefully before using this in production.

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

Sintaxis

animation.pause(); 

Parámetros

None.

Valor devuelto

None.

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 Status Comment
Web Animations
The definition of 'play()' in that specification.
Working Draft  

Compatibilidad del navegador

Feature Chrome Firefox (Gecko) Internet Explorer Opera Safari (WebKit)
Basic support 39.0 48 (48)[1] No support No support No support
Feature Android Android Webview Firefox Mobile (Gecko) IE Phone Opera Mobile Safari Mobile Chrome for Android
Basic support No support 39.0 48.0 (48)[1] No support No support No support 39.0

[1] La Web Animations API solo está habilitada por defecto en Firefox Developer Edition y Nightly builds. Puedes habilitarlo en versiones Beta y de lanzamiento estableciendo la preferencia dom.animations-api.core.enabled en true, y puedes deshabilitarlo en cualquier versión de Firefox estableciendo esta propiedad en false.

Ver también

Etiquetas y colaboradores del documento

 Colaboradores en esta página: IngoBongo
 Última actualización por: IngoBongo,