अभी मेरे पास एक सिंपल बटन सेट हैजब माउस को दबाया जाता है, तो माउस को छोड़ने पर उस एनीमेशन के प्रभाव को उलट देता है। एनीमेशन "शीर्ष", "बाएं", और "बॉक्स-छाया" गुणों को बदलता है। Jquery के .animate () फ़ंक्शन को तत्व के बॉक्स-छाया को प्रभावित करने की अनुमति देने के लिए मुझे एक विशेष jquery प्लगइन का उपयोग करना पड़ा। संदर्भ में आसानी के लिए, यहाँ एक है GitHub मेरे वर्तमान उदाहरण का भंडार.
समस्या यह है, भले ही माउस बटन होतुरंत जारी किया गया, इससे पहले कि यह स्वयं को उलट देना जारी रखता है, एनीमेशन पूरा हो जाता है। माउस बटन को दबाकर या जारी करके बटन "ऊपर" या "नीचे" चल रहा है या नहीं, इसे नियंत्रित करने के लिए उपयोगकर्ता पर वांछित प्रभाव पड़ता है। देख यह उदाहरण (अंतिम बॉक्स दाईं ओर) एक विचार प्राप्त करने के लिए कि मैं क्या हासिल करना चाहता हूं।
अब तक के मेरे शोध में, ऐसा लगता है कि इसे पूरा करने के लिए बाइंडिंग / अनबाइंडिंग का उपयोग किया जाना चाहिए, लेकिन एक उदाहरण को पूरा करने से पहले मैंने जिन उदाहरणों को "देखा नहीं" किया है।
उत्तर:
उत्तर № 1 के लिए 1जैसा कि आप jQuery का उपयोग कर रहे हैं,
आप .stop () का उपयोग कर सकते हैं
मिलान तत्वों पर वर्तमान में चल रहे एनीमेशन को रोकें।
या
आप .fishish () का भी उपयोग कर सकते हैं
वर्तमान में चल रहे एनीमेशन को रोकें, सभी पंक्तिबद्ध एनिमेशन हटाएं, और मिलान किए गए तत्वों के लिए सभी एनिमेशन को पूरा करें।
फिर आप तत्व के मूल मूल्यों पर वापस लौट सकते हैं क्योंकि एनीमेशन बंद हो गया है।