CSS3 animation-duration property
Definitions and usages
animation-duration: Defines how many seconds or milliseconds it takes for an animation to complete a cycle.
| Default: | 0 |
|---|---|
| Inherited: | no |
| Version: | CSS3 |
| JavaScript syntax: | object object.style.animationDuration="3s" |
Grammar
animation-duration: time;|
Value
|
Description |
| time | Set the interval, in seconds or milliseconds, for an animation cycle. The default value is 0, which means there will be no animation |
The animation is done in two seconds:
animation-duration:2s;
-webkit-animation-duration:2s; /* Safari and Chrome */
-webkit-animation-duration:2s; /* Safari and Chrome */
Try it out . . .
Browser support
The numbers in the table support the first browser version number of the property.
The number immediately before -webkit-, -ms- or -moz- is the first browser version number that supports the prefix property.
| Attributes | |||||
|---|---|---|---|---|---|
| animation-duration |
43.0
3.0 -webkit- |
10.0 |
16.0
5.0 -moz- |
9.0
4.0 -webkit- |
30.0
15.0 -webkit- 12.0 -o- |
Related articles
CSS3 tutorial: CSS3 animation