Propriété animation-fill-mode CSS

Définition et utilisation

animation-fill-mode L'attribut détermine si l'effet d'animation est visible avant ou après la lecture de l'animation.

Remarque :Les valeurs de l'attribut sont un ou plusieurs mots-clés de mode de remplissage séparés par des virgules.

Veuillez également consulter :

Tutoriel CSS3 :Animation CSS

Manuel de référence HTML DOM :Attribut animationFillMode

Exemple

Définit le mode de remplissage pour l'élément h1 :

h1
  {
  animation-fill-mode: forwards;
  }

Syntaxe CSS

animation-fill-mode : none | forwards | backwards | both;
Valeur Description
none Ne change pas le comportement par défaut.
forwards Après la fin de l'animation, conservez la dernière valeur de propriété (définit dans le dernier keyframe).
backwards Dans la période spécifiée par animation-delay, appliquez la valeur de propriété de début (définit dans le premier keyframe) avant que l'animation ne soit affichée.
both Les modes de remplissage avant et après sont tous deux appliqués.

Détails techniques

Valeur par défaut : none
Héritabilité : non
Version : CSS3
Syntaxe JavaScript : object.style.animationFillMode=none

Prise en charge du navigateur

Les nombres dans le tableau indiquent la première version du navigateur qui prend en charge cette propriété en intégralité.

Les nombres précédés de -webkit-、-moz- ou -o- représentent la première version utilisant les préfixes.

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-