Skip to content

AnimationOptions

name

name: readonly string Required

The name of the animation, used to identify the animation in the timeline.

to

to: number Required

The ending value of the animation.

from

from?: number Default: 0

The starting value of the animation.

duration

duration?: number | (index: number) => number Default: 350

The duration of the animation in milliseconds.

offset

offset?: number | (index: number) => number Default: 0

Offsets the animation by a specific value in milliseconds. a positive value will act like a delay, while a negative value will play the animation earlier.

delay

delay?: number | (index: number) => number Default: 0

This property specifies the delay before the animation starts, in milliseconds.

playCount

playCount?: number | (index: number) => number Default: 1

The number of times the animation should play. A value of 0 means this animation will be ignored.

delayCount

delayCount?: number | (index: number) => number Default: playCount

The number of times the delay should be applied on each animation play. For example, with delayCount: 1 and playCount: 4, the delay will be applied only once on the first play.

direction

direction?: Direction | (index: number) => Direction Default: Direction.Forward

The direction in which the animation should play.

See: Direction

timing

timing?: Timing | (index: number) => Timing Default: Timing.AfterPrevious

The position of the animation in the timeline, determining when it should start relative to the timeline.

See: Timing

ease

ease?: (t: number) => number Default: ease.linear

The easing function for the animation, defining the rate of change of the animated value over time.

See: Ease