CSS3 animation-delayProperty

Example

Wait two seconds, then start the animation:

animation-delay:2s; -webkit-animation-delay:2s; /*Safari and Chrome*/

Try it Yourself »
More examples at the bottom of this page.

The numbers in the table specify the first browser version that supports the property.

The number immediately preceding -webkit-, -ms- or -moz- specifies the first browser version that supports the prefixed property.

Property
animation-delay	43.0 4.0 -webkit-	10.0	16.0 5.0 -moz-	9.0 4.0 -webkit-	30.0 15.0 -webkit- 12.0 -o-

The animation-delay property defines when the animation starts.

The animation-delay value unit can be seconds (s) or milliseconds (ms).

Tip:Negative values are allowed. -2s makes the animation start immediately, but skips 2 seconds into the animation.

Default Value:	0
Inherited:	no
version:	CSS3
JavaScript Syntax:	object object.style.animationDelay="2s"

animation-delay: time;

Value	Description	Testing
time	Optional. Defines the time to wait before the animation starts, in seconds or milliseconds. Default value is 0.

Negative values. Please note that the animation skips 2 seconds into the animation cycle:

animation-delay: -2s /* Opera */ -moz-animation-delay: -2s /* Firefox */ -webkit-animation-delay: -2s /*Safari and Chrome*/

other extensions