The best CSS3 transition-duration property Tutorial In 2024, In this tutorial you can learn Examples,Browser Support,Attribute definitions and instructions,grammar,

CSS3 transition-duration property

Examples

Last 5 seconds of switching effect occurs:

transition-duration: 5s;
-webkit-transition-duration: 5s; /* Safari */


Browser Support

Figures in the table represent the first browser to support the version number of the property.

Immediately following the digital -webkit-, -ms- or -moz- ago in support of the prefix attribute first browser version number.

属性
transition-duration 26.0
4.0 -webkit-
10.0 16.0
4.0 -moz-
6.1
3.1 -webkit-
12.1
10.5 -o-

Attribute definitions and instructions

Time (in seconds or milliseconds) it takes to transition effect transition-duration property for completion.

Defaults: 0
inherit: no
version: CSS3
JavaScript syntax: object .style.transitionDuration = "5s"


grammar

transition-duration:time;

value description
time Predetermined period of time (in seconds or milliseconds) it takes to complete the transition effect. The default value is 0, which means there will be no effect.
CSS3 transition-duration property
10/30