NovaMonoFix
Errores PHP
X
Usuario
Password
0 FPS

Propiedad CSS : animation-fill-mode

30 de Diciembre del 2020 por Josep Antoni Bover. 38 visitas, 0 comentarios, 0 votos
Categorías : CSS.
La web está en segundo plano, animación en pausa.
Cargando animación...

Esta propiedad se usa para especificar el comportamiento de las propiedades del elemento animado a la hora de empezar y de terminar la animación.

Por defecto las animaciones CSS solo afectan al elemento desde que el primer keyframe es ejecutado y hasta que el ultimo keyframe es ejecutado.

animation-delay termina justo al empezar el primer keyframe.


Sintaxis

animation-fill-mode: Valor;
none La animación no aplicara ningún estilo al elemento antes y despues de ser ejecutada. (Valor por defecto)
forwards Una vez terminadas todas las iteraciones de la animación, el elemento obtendrá los valores finales de la animación.
backwards Antes de empezar la animación (y el delay), el elemento obtendrá los valores iniciales de la animación.
both Antes de empezar la animación (y el delay), el elemento obtendrá los valores iniciales de la animación. Y una vez terminadas todas las iteraciones de la animación, el elemento obtendrá los valores finales de la animación.
initial Asigna la propiedad a su valor por defecto.
inherit Se heredara el estilo de su objeto padre.
Este valor no se soporta en IE7, y en IE8 requiere la declaración de un !DOCTYPE.


Código de ejemplo



Compatibilidad

Esta propiedad es soportada por todos los navegadores compatibles con CSS3.

Soportado a partir de la versión 2 con el prefijo -webkit-
Soportado a partir de la versión 16
Soportado a partir de la versión 15 con el prefijo -webkit-
Soportado a partir de la versión 4 con el prefijo -webkit-
Soportado a partir de la versión 10

Documento modificado por última vez : 30/12/2020
Ejemplo modificado por última vez : 30/12/2020

Enlaces relacionados