Transition-delay

Transition-delay specifies how long after it is triggered the transition will start.
Use seconds 's', or milliseconds 'ms' to define the value.

See also:

• transition
• transition-property
• transition-timing-function
• transition-duration

Transition-property

Transition-property specifies a list of properties to be changed by the transition.

List of CSS properties that can be changed with transition.

See also:

• transition
• transition-property
• transition-duration
• transition-timing-function
• transition-delay

• Read more

Transition-timing-function

Transition-timing-function sets the timing function to be used by the transition.

• linear Constant speed
• ease Default, gradual slowdown
• ease-in Speed up
• ease-out Slow down
• ease-in-out Speed up then slow down
• cubic-bezier(x1, y1, x2, y2) X and Y values are between 0 and 1 to define the shape of a bezier curve. This can be used to define custom timings.

• Read more

Transition-duration

Transition-duration specifies how many seconds 's' or milliseconds 'ms' a transition effect takes to complete.

See also:

• transition
• transition-property
• transition-timing-function
• transition-delay

Transition

Transition is all about what happens when a property changes form one value to another. How long it takes and what timing function is used.
Transition is a shorthand rule for:

• transition-property which specifies what property you are changing.
• transition-duration the length of time the transition takes.
• transition-timing-function the timing function used eg. ease, linear.

• Read more