Delay before the CSS transition is displayed.
Syntax
transition-delay: time [,time2] ;
time - One or more offset times, separated by commas, followed by a time unit designator (ms or s).
If more than one transition delay is given they will apply in turn to the (multiple) transition elements specified with transition-property.
Transitions are typically applied to CSS properties that are set to change on hover, if assigned to the normal state, the animation would run immediately when the page is loaded.
Examples:
h1 { transition-delay: 1.5s; }
.emw3class { transition-delay: 250ms; }
#emw3id { transition-delay: 8s; }
Try it:
This sample has a MouseOver / :hover style that changes the height and width and adds a red background. {width: 500px; height: 300px; background: red;} Reload the page to restart. |
(CSS 3) Browser Support: IE 10 only, use the equivalent -moz-transition-delay for Firefox and -webkit-transition-delay for Safari and Chrome.
“It's no delay to stop to edge the tool” ~ Irish Saying
Related:
transition-property - Apply a transition effect to one or more CSS properties.
transition-duration - The time a CSS transition effect takes to complete.
transition-timing-function - Speed curve of the transition effect.
transition - Shorthand to set the four transition- properties.