Style transitionTimingFunction Property
Style transitionTimingFunction Property
The transitionTimingFunction property is used to specify the speed curve of the transition effect. It allows us to change the transition effect over its duration.
Syntax:-
Its syntax is:- object.style.transitionTimingFunction OR object.style.transitionTimingFunction = ease | linear | ease-in | ease-out | ease-in-out | cubic-bezier() | initial | inherit
Return:-
Its return is:- string having transition-timing-function property of an element
Further Explanation:-
Value | Description |
---|---|
ease | Specifies transition effect with slow start, then fast, then end slowly. |
linear | Specifies transition effect with same speed from start to end. |
ease-in | Specifies transition effect with slow start. |
ease-out | Specifies transition effect with slow end. |
ease-in-out | Specifies transition effect with slow start and end. |
cubic-bezier(n, n, n, n) | Define our own values in cubic-bezier function. Values ranges from 0 to 1. |
initial | Sets property to its default value. |
inherit | Inherits property from its parent element. |