This is an experimental technology
Because this technology's specification has not stabilized, check the compatibility table for the proper prefixes to use in various browsers. Also note that the syntax and behavior of an experimental technology is subject to change in future versions of browsers as the spec changes.
Resumen
La propiedad CSS animation-play-state determina si una animación está en ejecución o en pausa. Puede ser consultada para determinar si la animación se está ejecutando. Además, su valor se puede establecer para pausar y reanudar una animación.
Reanudando una animación pausada, ésta empezará en el punto en el que fue pausada, en vez de empezar desde el principio.
| Valor inicial | running |
|---|---|
| Applies to | todos los elementos y los pseudoelementos ::before y ::after |
| Heredable | no |
| Media | visual |
| Valor calculado | como se especifica |
| Animatable | no |
| Canonical order | el orden único no-ambigüo definido por la gramática formal |
Sintaxis
/* Single animation */ animation-play-state: running; animation-play-state: paused; /* Multiple animations */ animation-play-state: paused, running, running; /* Global values */ animation-play-state: inherited; animation-play-state: initial; animation-play-state: unset;
Valores
running- La animación se está ejecutando.
paused- La animación está pausada.
Syntax formal
<single-animation-play-state>#where
<single-animation-play-state> = running | paused
Ejemplos
Visita animaciones CSS para ver algunos ejemplos.
Especificaciones
| Especificación | Estado | Comentario |
|---|---|---|
| CSS Animations The definition of 'animation-play-state' in that specification. |
Working Draft | Definición incial |
Compatibilidad entre navegadores
| Característica | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari (WebKit) |
|---|---|---|---|---|---|
| Soporte básico | (Yes)-webkit 43.0 |
5.0 (5.0)-moz 16.0 (16.0) |
10 | 12 -o 12.10 |
(Yes)-webkit |
| Característica | Android | Chrome | Firefox Mobile (Gecko) | IE Phone | Opera Mobile | Safari Mobile | Chrome for Android |
|---|---|---|---|---|---|---|---|
| Soporte básico | ? | ? | ? | ? | ? | ? | ? |