AnimationEffect: getTiming() method
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since March 2020.
The AnimationEffect.getTiming()
method of the AnimationEffect
interface returns an object containing the timing properties for the Animation Effect.
Note: Several of the timing properties returned by getTiming()
may take on the placeholder value "auto"
. To obtain resolved values for use in timing computations, instead use AnimationEffect.getComputedTiming()
.
In the future, "auto"
or similar values might be added to the types of more timing properties, and new types of AnimationEffect
might resolve "auto"
to different values.
Syntax
getTiming()
Parameters
None.
Return value
An object containing the following properties:
delay
-
The
number
of milliseconds of delay before the start of the effect.(See also
animation-delay
.) direction
-
"normal"
,"reverse"
,"alternate"
, or"alternate-reverse"
.Indicates whether the effect runs forwards (
"normal"
), backwards ("reverse"
), switches direction after each iteration ("alternate"
), or runs backwards and switches direction after each iteration ("alternate-reverse"
).(See also
animation-direction
.) duration
-
A
number
of milliseconds or thestring
"auto"
.Indicates the time one iteration of the animation takes to complete.
The meaning of
"auto"
may differ depending on the type of effect; forKeyframeEffect
,"auto"
is the same as0
.(See also
animation-duration
.) easing
-
A
string
representing an<easing-function>
describing the rate of change of the effect over time.(See also
animation-timing-function
.) endDelay
-
The
number
of milliseconds of delay after the end of the effect.This is primarily of use when sequencing animations based on the end time of another animation.
fill
-
"none"
,"forwards"
,"backwards"
,"both"
, or"auto"
.Indicates whether the effect is reflected by its target(s) prior to playing (
"backwards"
), retained after the effect has completed ("forwards"
),"both"
, or neither ("none"
).The meaning of
"auto"
may differ depending on the type of effect; forKeyframeEffect
,"auto"
is the same as"none"
.(See also
animation-fill-mode
.) iterations
-
The
number
of times the effect will repeat. A value ofInfinity
indicates that the effect repeats indefinitely.(See also
animation-iteration-count
.) iterationStart
-
A
number
indicating at what point in the iteration the effect starts. For example, an effect with aniterationStart
of 0.5 and 2iterations
would start halfway through its first iteration and end halfway through a third iteration.
Specifications
Specification |
---|
Web Animations # dom-animationeffect-gettiming |
Browser compatibility
BCD tables only load in the browser