Animation Delay Property in CSS3

[dannyhekovsky0]

Let's discuss, what is a animation-delay

in CSS3.

The animation-delay

property specifies when the animation should start.

The animation-delay

value can be defined in seconds (s) or milliseconds (ms).

Syntax of this property:
animation-delay: time | initial | inherit ;

Property Values:
time - it specifies the time (can be a negative number) before the animation begins. This is a time difference from when the animation is applied to the element.

The time may be specified in either seconds (by specifying "s" as the unit) or milliseconds (by specifying "ms" as the unit). If no units are specified, seconds are assumed. (optional)

The Defaultvalue is 0.

initial - it specifies that the value of the property should be set to the default value

inherit - it specifies that the value of the property should be inherited from the parent element

Example:

I have here an example animation using time difference of 0 seconds, 2 seconds and -2 seconds. See for yourself the difference.

CSS3 animation-delay

delay 0s

delay 2s

delay -2s

Note: Due to the size or complexity of this submission, the author has submitted it as a .zip file to shorten your download time. After downloading it, you will need a program like Winzip to decompress it.

Virus note: All files are scanned once-a-day by SourceCodester.com for viruses, but new viruses come out every day, so no prevention program can catch 100% of them.

FOR YOUR OWN SAFETY, PLEASE:

1. Re-scan downloaded files using your personal virus checker before using it.

2. NEVER, EVER run compiled files (.exe's, .ocx's, .dll's etc.)--only run source code.

Download