एनिमेशन-डिले प्रॉपर्टी
animation-delay प्रॉपर्टी
एनिमेशन शुरू होने से पहले देरी सेट करती है।
सिंटैक्स
सिलेक्टर {
animation-delay: s या ms में समय;
}
वैल्यूज
| वैल्यू | विवरण |
|---|---|
s |
सेकंड में समय निर्दिष्ट करता है (उदाहरण 3s)। |
ms |
मिलीसेकंड में समय निर्दिष्ट करता है (उदाहरण 3ms)। एक सेकंड 1000 मिलीसेकंड होता है। |
डिफॉल्ट वैल्यू: 0s.
उदाहरण
इस उदाहरण में, एनिमेशन शुरू होने से पहले
3 सेकंड की देरी होगी:
<div id="elem"></div>
@keyframes move {
from {
margin-left: 0;
}
to {
margin-left: 400px;
}
}
#elem {
animation-delay: 3s;
animation-duration: 6s;
animation-name: move;
animation-iteration-count: infinite;
animation-timing-function: linear;
border: 1px solid black;
width: 50px;
height: 50px;
}
:
यह भी देखें
-
animation-nameप्रॉपर्टी,
जो एनिमेशन का नाम सेट करती है -
animation-durationप्रॉपर्टी,
जो एनिमेशन की अवधि सेट करती है -
animation-timing-functionप्रॉपर्टी,
जो एनिमेशन की गति सेट करती है -
animation-iteration-countप्रॉपर्टी,
जो एनिमेशन के पुनरावृत्तियों की संख्या सेट करती है -
animation-directionप्रॉपर्टी,
जो एनिमेशन की दिशा सेट करती है -
animation-fill-modeप्रॉपर्टी,
जो एनिमेशन की स्थिति सेट करती है -
animation-play-stateप्रॉपर्टी,
जो एनिमेशन को पॉज़ करने की अनुमति देती है -
animationप्रॉपर्टी,
जो एनिमेशन के लिए एक शॉर्टहैंड है -
@keyframesकमांड,
जो एनिमेशन की कीफ्रेम सेट करती है -
transitionस्मूद ट्रांजिशन, जो एलिमेंट पर हॉवर करने पर एनिमेशन प्रदान करते हैं