Contrôler la Quantité et la Direction de Lecture de l'Animation

Propriété animation-iteration-count

Nous pouvons contrôler combien de fois une animation est censée être jouée. animation-iteration-count définit le nombre de fois que l'animation sera répétée.

Nous pouvons également spécifier le mot-clé infinite comme valeur. Ainsi, l'animation se déroulera toujours. Considérons l'exemple suivant et voyons comment nous pouvons affecter le nombre d'animations :

Propriété animation-direction

animation-direction contrôle la direction de l'animation. Elle détermine si une animation doit se jouer vers l'avant, vers l'arrière, ou alterner entre l'avant et l'arrière.

• normal - valeur par défaut. L'animation se jouera vers l'avant du début à la fin;
• reverse - L'animation se jouera vers l'arrière de la fin au début;
• alternate - L'animation se jouera vers l'avant puis vers l'arrière, alternant entre les deux directions;
• alternate-reverse - L'animation se jouera vers l'arrière puis vers l'avant, alternant entre les deux directions.

Voyons quel effet nous pouvons obtenir dans l'exemple suivant. Nous aurons une image dans laquelle le comportement par défaut est de se déplacer de manière répétée de la gauche vers la droite. Cependant, nous pouvons changer son comportement. Nous testerons les quatre valeurs pour la propriété animation-direction.