Style animationTimingFunction Property
Style animationTimingFunction Property
The animationTimingFunction is used to specify the speed curve of the animation. It actually used to make smooth changes and define the TIME an animation uses to change from one set of CSS styles to another.
Syntax:-
Its syntax is:- object.style.animationTimingFunction OR object.style.animationTimingFunction = linear|ease|ease-in|ease-out|cubic-bezier(n, n, n, n)|initial|inherit
Return:-
Its return is:- string having animation-timing-function property of an element
Further Explanation:-
Value | Description |
---|---|
linear | The animation has the same speed from start to end |
ease | The animation has a slow start, then fast, before it ends slowly |
ease-in | The animation has a slow start |
ease-out | The animation has a slow end |
ease-in-out | The animation has both a slow start and a slow end |
cubic-bezier(n, n, n, n) | Define our own values in the cubic-bezier function. |
initial | Sets property to its default value. |
inherit | Inherits property from its parent element. |