पर सीएसएस रिवर्स एनीमेशन मेरे पास एक दो-चरणीय सीएसएस एनीमेशन है जिसे मैं "सक्रिय" होने पर एक बार आगे बढ़ना चाहता हूं, और फिर "निष्क्रिय" होने पर पिछड़ा भागना चाहता हूं। मुझे पता है कि अलग-अलग आगे और पिछड़े एनिमेशन, like so को परिभाषित करके हासिल करना संभव है, लेकिन मैं सोच रहा था कि यह एक एकल एनीमेशन और animation-direction: reverse
संपत्ति के साथ प्राप्त करने योग्य था या नहीं।माउसलेव
Q
माउसलेव
5
A
उत्तर
0
ऐसा कुछ? यदि ऐसा है तो क्या आप देख रहे हैं
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
transition: all 0.5s ease;
है आप हमारे लिए स्क्रिप्ट onClick
#test{
position:absolute;
height: 100px;
width: 100px;
background-color: #A8A8A8;
border-bottom: 0px solid black;
-o-transition: all 0.5s ease;
-ms-transition: all 0.5s ease;
-moz-transition: all 0.5s ease;
-webkit-transition: all 0.5s ease;
transition: all 0.5s ease;
}
#test:hover{
border-bottom: 10px solid black;
}
<div id="test">
</div>
0
साथ toggleClass
करने के क्रम में इसे करने के लिए जोड़ सकते हैं एक क्लिक में अटैच करने की जरूरत है
div {
background: aqua;
color: #fff;
margin: 0 auto;
padding: 100px 0;
-webkit-transition: -webkit-border-radius 1.5s ease-in;
-moz-transition: -moz-border-radius 1.5s ease-in;
-o-transition: border-radius 1.5s ease-in;
-ms-transition: border-radius 1.5s ease-in;
transition: border-radius 1.5s ease-in;
text-align: center;
width: 200px;
\t \t
\t \t -webkit-transition: all 3s ease;
-moz-transition: all 3s ease;
-o-transition: all 3s ease;
-ms-transition: all 3s ease;
transition: all 3s ease;
-webkit-transform: rotate(-360deg);
-moz-transform: rotate(-360deg);
-o-transform: rotate(-360deg);
-ms-transform: rotate(-360deg);
transform: rotate(-360deg);
}
div:hover {
background: red;
-webkit-border-radius: 100px;
-moz-border-radius: 100px;
border-radius: 100px;
-webkit-transition: -webkit-border-radius 1.5s ease-in;
-moz-transition: -moz-border-radius 1.5s ease-in;
-o-transition: border-radius 1.5s ease-in;
-ms-transition: border-radius 1.5s ease-in;
transition: border-radius 1.5s ease-in;
\t \t
\t \t -webkit-transition: all 3s ease;
-moz-transition: all 3s ease;
-o-transition: all 3s ease;
-ms-transition: all 3s ease;
transition: all 3s ease;
-webkit-transform: rotate(360deg);
-moz-transform: rotate(360deg);
-o-transform: rotate(360deg);
-ms-transform: rotate(360deg);
transform: rotate(360deg);
}
<div></div>
संबंधित मुद्दे
- 1. jQuery माउसलेव
- 2. ('div') माउसेंटर ('ए') पर माउसलेव
- 3. डब्ल्यूपीएफ मूसडाउन => कोई माउसलेव इवेंट
- 4. पूरे पूरे विंडो पर माउसहोवर/माउसलेव घटना
- 5. jQuery .on() प्रतिनिधि माउसेंटर और माउसलेव
- 6. स्पर्श इंटरैक्शन के लिए 'माउसलेव' के बराबर जावास्क्रिप्ट
- 7. किसी ऑब्जेक्ट पर क्लिक किए जाने पर माउसलेव को रोकें
- 8. स्पर्श डिवाइस पर jQuery होवर (माउसएन्टर, माउसलेव) को अनदेखा करें
- 9. jquery कार्यों का संयोजन - ऑन() होवर/माउसएन्टर/माउसलेव
- 10. कोणीय निर्देशक माउसेंटर/माउसलेव काम कर रहा है लेकिन माउसलेव के बाद प्रारंभिक स्थिति में सेट नहीं है। किसी भी सलाह की बहुत सराहना की जाएगी
- 11. क्रोम पर बूटस्ट्रैप टैब शो ईवेंट के साथ माउसलेव और माउसआउट क्यों काम नहीं करता है?
- 12. सी # माउसलेव और माउसेंटर इवेंट आग नहीं है अगर माउस बटन पर क्लिक किया जाता है
- 13. एक चयनकर्ता के साथ एक कंटेनर पर माउसलेव - इंटरनेट एक्सप्लोरर 10
- 14. एक और विशिष्ट तत्व दर्ज करते समय jQuery माउसलेव इवेंट रोकें
- 15. एक एसवीजी में बाल तत्वों को दर्ज/छोड़ते समय माउसेंटर/माउसलेव घटनाएं क्यों आग लगती हैं?
- 16. माउसओवर और माउसलेव ट्रिगर हर बार जब मैं माउस को दिए गए तत्व के अंदर माउस ले जाता हूं
- 17. कोई विचार क्यों कर्सर को तेजी से ले जाने पर माउसलेव ईवेंट पंजीकरण नहीं कर रहा है?
- 18. Jquery: माउसलेव में देरी कैसे जोड़ें ताकि अगर कोई गलती से तत्व को अनजाने में बंद कर देता है, तो यह अभी भी
- 19. jQuery, कर्सर तेज़
- 20. jQuery अक्षम और स्क्रॉलिंग सक्षम करें
- 21. div
- 22. jquery
- 23. डब्ल्यूपीएफ
- 24. नियंत्रण के स्क्रॉलबार
- 25. CSS3 संक्रमण - जेड-इंडेक्स संपत्ति के रीसेट में देरी कैसे करें?
- 26. एएसपी.नेट अपडेट पैनल
- 27. jQuery फोकसलेव घटना?
- 28. jquery addclass/removeclass हमेशा काम नहीं करता है जब "गति" सेट होता है (माउस ईवेंट)
- 29. जावास्क्रिप्ट addEventListener - माउसओवर प्रभाव बनाने के लिए उपयोग कर रहे हैं?
- 30. एचटीएमएल 5 कैनवास में क्लिक करने योग्य बिंदु कैसे बनाएं?
यह 2 कदम संक्रमण नहीं है – woojoo666