/ / लूप "फ़्लैश" एनीमेशन 3 बार, फिर 5 सेकंड में देरी, Animate.css के साथ फिर से लूप - एचटीएमएल, सीएसएस, एनीमेशन, सीएसएस-एनिमेशन

लूप "फ्लैश" एनीमेशन 3 बार, फिर 5 सेकंड में देरी, Animate.css के साथ फिर से लूप - एचटीएमएल, सीएसएस, एनीमेशन, सीएसएस-एनिमेशन

वास्तव में Animate.css के रूप में, बस "फ़्लैश" सुविधा को कॉन्फ़िगर करने का प्रयास कर रहा है।

मैंने एक अतिरिक्त कक्षा (.promptflash) जोड़ा है।

मैं 3 बार फ्लैश कैसे कर सकता हूं, फिर 5 सेकंड के लिए देरी कर सकता हूं और लूप को 3 बार दोहरा सकता हूं, फिर देरी हो .. दोहराएं ...

शुरुआती फ्लैश एनीमेशन को थोड़ा धीमा करने की भी कोशिश कर रहा है क्योंकि यह डिफ़ॉल्ट रूप से काफी तेजी से चमकता है

एनिमेट.सीएसएस - सुविधाओं की सूची

.promptflash {
animation: 0.3s infinite;
animation-delay: 2s;
}

उत्तर:

जवाब के लिए 0 № 1

यहां आपके पास काम है jsfiddle उसके लिए। यह बिना -webkit और -moz उपसर्गों के बिना आपको यह दिखाने के लिए है कि आप इसे कैसे बना सकते हैं।

.flash {
-webkit-animation-name: move;
animation-name: move;
animation-duration:6s;

}

@keyframes move{
0% { opacity: 0;}
5% { opacity: 1;}
10% { opacity: 0;}
15% { opacity: 1;}
20% { opacity: 0;}
25% { opacity: 1;}
}