Menu Samaritan's Purse

ANIMATION-DIRECTION

The animation-direction property defines whether or not the animation should play in reverse on some or all cycles.

SYNTAX

CSS

animation-direction: value;

JS

object.style.animationDirection = "value";

VALUES

<'animation-direction'> = <single-animation-direction>#
<single-animation-direction> = normal | reverse | alternate | alternate-reverse
normal

All iterations of the animation are played as specified. Intial.

reverse

All iterations of the animation are played in the reverse direction from the way they were specified.

alternate

The animation cycle iterations that are odd counts are played in the normal direction, and the animation cycle iterations that are even counts are played in a reverse direction.

alternate-reverse

The animation cycle iterations that are odd counts are played in the reverse direction, and the animation cycle iterations that are even counts are played in a normal direction.

INITIAL

normal

EXAMPLES

ALTERNATE

ALTERNATE-REVERSE

NORMAL

REVERSE

JS

INTERNAL

animation

animation-delay

animation-duration

animation-fill-mode

animation-iteration-count

animation-name

animation-play-state

animation-timing-function

EXTERNAL

World Wide Web Consortium (W3C)