transition-delay property
Gets or sets one or more values that specify the offset within a transition (the amount of time from the start of a transition) before the transition is displayed for a set of corresponding object properties identified in the transition property.
This property is read/write.
![]() ![]() |
Syntax
transition-delay:
<time>
[ ,
<time>
] *
Property values
One or more offset times, separated by commas.
- time
-
Floating-point number, followed by a time units designator ("ms" or "s"). For more information about supported time units, see CSS Values and Units Reference.
CSS information
| Applies To | all elements, :before and :after pseudo elements |
|---|---|
| Media | interactive |
| Inherited | no |
| Initial Value | 0 |
Standards information
- CSS Transitions Module Level 3, Section 2.4
Remarks
As of Microsoft Edge, the "-ms-" prefixed version of this property is not supported.
Values are rounded up to the second decimal place.
Each transition-delay is paired with a corresponding object property identified in the transition-property property.
If more transition-delay values are declared than corresponding object properties identified in the transition-property property, the excess transition-delay values are ignored.
If fewer transition-delay values are declared than corresponding object properties identified in the transition-property property, the list of transition-delay values is repeated from the beginning until the object properties are exhausted.
Do not use the Microsoft vendor prefix ("-ms-") before the transition properties. They are supported unprefixed in Internet Explorer 10 and later.
To learn more about Cascading Style Sheets (CSS) transitions in Windows Internet Explorer, see How to bring your webpage to life with CSS transforms, transitions, and animations.
As of Internet Explorer for Windows Phone 8.1 Update, Internet Explorer for Windows Phone supports "-webkit-transition-delay" as an alias for this property.
See also
- a
- abbr
- acronym
- address
- b
- bdo
- big
- blockQuote
- br
- button
- cite
- code
- CSSStyleDeclaration
- currentStyle
- dd
- del
- dfn
- div
- dl
- dt
- em
- fieldSet
- form
- i
- img
- input
- ins
- kbd
- label
- li
- map
- noFrames
- noScript
- object
- ol
- p
- pre
- q
- samp
- script
- select
- small
- span
- strong
- style
- sub
- sup
- table
- tBody
- td
- textArea
- tFoot
- th
- tHead
- tr
- tt
- ul
- var
- How to bring your webpage to life with CSS transforms, transitions, and animations

