animation-timing-function
Sets how the animation will progress over one cycle
Syntax
{ animation-timing-function:
sVar
}
Possible values
sVar
A variant that specifies one of the following values:
|
ease |
|
|
linear |
|
|
ease-in |
|
|
ease-out |
|
|
ease-in-out |
|
|
cubic-bezier |
|
This property has a default value of auto. It is not inherited.
Remarks
For a keyframe animation, the animation-timing-function applies between keyframes, not over the entire animation. For example, in the case of an ease-in-out timing function, an animation will ease in at the start of the keyframe and ease out at the end of the keyframe. An animation-timing-function defined within a keyframe block applies to that keyframe, otherwise the timing function specified for the animation is used.
Standards information
Important |
|---|
|
This documentation is preliminary and subject to change. |
See also
Concepts
animationanimation-delay
animation-direction
animation-duration
animation-iteration-count
animation-name
Important