CSS transition-delay property

Property values

+ve value (seconds)Default

0

transition-delay accepts value in seconds. 0s means the transition starts its execution as soon as it starts.

transition-delay: 0s;

Try it { }

+ve value (seconds)

2.5

transition-delay also accepts fractional values. 2.5s means the transition starts execution after 2.5 seconds when it is applied.

transition-delay: 2.5s;

Try it { }

+ve value (milliseconds)

2000

value in milliseconds may also be used. 2000ms means 2s. Wait for 2000ms to see the execution of transition.

transition-delay: 2000ms;

Try it { }

-ve value (seconds)

-2

It starts execution partway through its life cycle. If the transition-duration is 3s and transition-delay is -2s, it shows a part of cycle that remains after subtracting transition-delay from transition-duration (1s).

transition-delay: -2s;

Try it { }