Atributo animation-fill-mode CSS

Definición y uso

animation-fill-mode La propiedad especifica si el efecto de animación es visible antes o después de la reproducción de la animación.

Nota:Sus valores son una o más palabras clave de relleno separadas por comas.

Véase también:

Tutoriales de CSS3:Animación de CSS

Manual de referencia de HTML DOM:Propiedad animationFillMode

Ejemplo

Establece el modo de relleno para el elemento h1:

h1
  {
  animation-fill-mode: forwards;
  }

Sintaxis de CSS

animation-fill-mode : none | forwards | backwards | both;
Valor Descripción
none No cambia el comportamiento predeterminado.
forwards Después de que la animación se complete, mantén el último valor de la propiedad (definido en el último fotograma clave).
backwards En el tiempo especificado por animation-delay, antes de que se muestre la animación, se aplica el valor de la propiedad de inicio (definido en el primer fotograma clave).
both Ambos modos de relleno hacia adelante y hacia atrás se aplican.

Detalles técnicos

Valor predeterminado: none
Herencia: no
Versión: CSS3
Sintaxis de JavaScript: object.style.animationFillMode=none

Compatibilidad del navegador

Los números en la tabla indican la primera versión del navegador que admite completamente la propiedad.

Los números con -webkit-, -moz- o -o- indican la primera versión que utiliza el prefijo.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
43.0
4.0 -webkit-		 10.0 16.0
5.0 -moz-		 9.0
4.0 -webkit-		 30.0
15.0 -webkit-
12.1
12.0 -o-