Animation-Delay
एनीमेशन कब start होगा यह control करने के लिए animation-delay property का उपयोग किया जाता है। इसकी value second या millisecond में specify किया जाता है। यदि value 2s है तो इसका मतलब है की एनीमेशन 2 seconds के बाद शुरू होगा।
Synatx: animation-delay:3s;
animation-direction
यहाँ पर direction का मतलब है forward और reverse. animation reverse direction में run होगा, forward में होगा या alternate cycle में run होगा यह specify किया जाता है animation-direction property से।
इस property के कुछ values इस प्रकार हो सकते हैं:
-
normal (default): animation forward direction (0% से 100%) में play होगा
-
reverse: reverse direction (100% से 0%) में play करने के लिए
-
alternate: हर odd cycle (1, 3, 5,…) में forward direction और even cycle (2, 4, 6, …) में reverse direction में run करने के लिए।
-
alternate-reverse: यह alternate का just उल्टा होता है। हर odd cycle में reverse और even cycle में forward direction में play होता है।
Syntax: animation-direction: reverse;
Animation-Delay
The animation-delay property is used to control when the animation will start. Its value is specified in second or millisecond. If the value is 2s it means that the animation will start after 2 seconds.
Synatx: animation-delay:3s;
animation-direction
Here direction means forward and reverse. Whether the animation will run in reverse direction, forward or in alternate cycle is specified by the animation-direction property.
Some values of this property can be as follows:
-
normal (default): animation will play in forward direction (0% to 100%)
-
reverse: To play in reverse direction (100% to 0%)
-
alternate: To run in forward direction in every odd cycle (1, 3, 5, …) and in reverse direction in even cycle (2, 4, 6, …).
-
alternate-reverse: This is just the opposite of alternate. In every odd cycle it is played in reverse direction and in even cycle it is played in forward direction.
Syntax: animation-direction: reverse;