नए निष्पादन से पहले Jquery में पिछले सभी एनिमेशन को कैसे रोकें?

Question

मैं सिर्फ JQuery के साथ कुछ प्रयोग कर रहा हूं।

मैं एक छवि है जो एक और छवि में के रूप में mouseOver() होता fades और पर mouseOut()

यह अच्छा काम करता है को छोड़कर अगर आप बार-बार लिंक पर अपने माउस आगे बढ़ रहे हैं, कहते हैं कि 5 बार, छवि fades वापस fades है बार-बार अंदर और बाहर, 5 बार जब आप बस वहां बैठते हैं और इस पागल व्यवहार से निपटने के लिए प्रतीक्षा करते हैं।

इस व्यवहार को रोकने के लिए, मैंने ध्वज का उपयोग करने की कोशिश की और केवल एनीमेशन शुरू करने की कोशिश की, अगर यह पहले से ही एनिमेट नहीं कर रहा है, लेकिन, अनुमान लगाओ क्या? यदि, कहें, मेरे पास 4 ऐसे बटन हैं, और प्रत्येक बटन माउसओवर पर मैं लुप्त हो रहा हूं एक अलग छवि में, ध्वज झूठी होने के बाद एनीमेशन को अनदेखा कर दिया जाएगा।

तो क्या नए लोगों को निष्पादित करने से पहले सभी पिछले एनिमेशन को रोकने का कोई तरीका है? मैं

---

JQuery

में सामान्य fadeIn() और slideDown() कार्यों के बारे में बात कर रहा हूँ संपादित करें: लिंक से कोड जोड़ना।

<a href="javascript:void(0);" onMouseOver="mouseOverOut(false);" onMouseOut="mouseOverOut(true);">Tick</a> 

जावास्क्रिप्ट

function mouseOverOut(t) 
{ 
    if(t) 
    { 
     $('.img1').fadeIn(); 
     $('.img2').fadeOut(); 
    } 
    else 
    { 
     $('.img1').fadeOut(); 
     $('.img2').fadeIn(); 
    } 
} 

Answer 1

का उपयोग कर fadeIn/Out साथ .stop() का उपयोग कारण अस्पष्टता एक आंशिक राज्य में फंस कर सकते हैं।

एक समाधान .fadeTo() का उपयोग करना है, जो अस्पष्टता के लिए एक पूर्ण गंतव्य प्रदान करता है।

function mouseOverOut(t) { 
    if(t) { 
     $('.img1').stop().fadeTo(400, 1); 
     $('.img2').stop().fadeTo(400, 0); 
    } 
    else { 
     $('.img1').stop().fadeTo(400, 0); 
     $('.img2').stop().fadeTo(400, 1); 
    } 
} 

यहां लिखने का एक छोटा तरीका है।

function mouseOverOut(t) { 
    $('.img1').stop().fadeTo(400, t ? 1 : 0); 
    $('.img2').stop().fadeTo(400, t ? 0 : 1); 
} 

या यह काम कर सकता है। हालांकि, पहले परीक्षण करें।

function mouseOverOut(t) { 
    $('.img1').stop().fadeTo(400, t); 
    $('.img2').stop().fadeTo(400, !t); 
} 

संपादित करें: यह अंतिम काम काम करता है। सत्य/झूठा का अनुवाद 1/0 है। आप सीधे .animate() का उपयोग भी कर सकते हैं।

function mouseOverOut(t) { 
    $('.img1').stop().animate({opacity: t}); 
    $('.img2').stop().animate({opacity: !t}); 
} 

Answer 2

आप पहले से ही stop() की कोशिश की?

विवरण: मिलान किए गए तत्वों पर वर्तमान में चल रहे एनीमेशन को रोकें।

Answer 3

.stop()