क्यूई

Question

में सभी एनिमेशन के अंत तक कूदने के लिए jQuery स्टॉप (सत्य, सत्य) मैं चल रहा एनिमेशन साफ़ करने के लिए jQuery की stop(true, true) विधि का उपयोग कर रहा हूं ताकि अगला तुरंत शुरू हो सके। मैंने देखा कि पहला पैरामीटर, clearQueue, संपूर्ण एनीमेशन कतार को साफ़ करता है लेकिन दूसरा पैरामीटर, jumpToEnd, केवल वर्तमान में चल रहे एनीमेशन के अंत तक कूदता है और कतार से हटाए गए नहीं। क्या यह स्पष्ट करने और सभी कतारबद्ध एनिमेशन के अंत तक कूदने का कोई तरीका है?

मैं इसके बजाय कुछ stop(false, true) कॉलों को चेन कर रहा हूं, लेकिन यह केवल 3 कतारबद्ध एनिमेशन को संभाल देगा, उदाहरण के लिए।

$(this) 
    .stop(false, true) 
    .stop(false, true) 
    .stop(false, true) 
    .addClass('hover', 200); 

संपादित करें:

मैं अपने विधि, stopAll जोड़ने प्रति आटेस गोरल के जवाब के रूप में समाप्त हो गया:

$.fn.extend({ stopAll: function() { 
    while (this.queue().length > 0) 
     this.stop(false, true); 
    return this; 
    } }); 

$(this).stopAll().addClass('hover', 200); 

मुझे आशा है कि किसी और को इस उपयोगी पाता है।

Answer 1

jQuery 1.9 .finish() विधि है, जो वास्तव में प्राप्त होता है की शुरुआत की।

Answer 2

एकाधिक stop(false, true) चेनिंग समझ में आता है। हार्ड-कोड श्रृंखलित कॉल की एक निश्चित संख्या के बजाय, आप जांच कर सकता है कतार की लंबाई:

while ($(this).queue().length) { 
    $(this).stop(false, true); 
} 

डेमो: http://jsfiddle.net/AB33X/

Answer 3

मैं भी jQuery 1.9 में विधि .finish() के प्रलेखन कि

 
Animations may be stopped globally by setting the property $.fx.off 
to true. When this is done, all animation methods will immediately 
set elements to their final state when called, rather than displaying an effect. 

भी .finish() प्रलेखन पृष्ठ पर विभिन्न तरीकों का एक अच्छा प्रदर्शन नहीं है से ध्यान दें।

Answer 4

नई एनीमेशन को देखने से पहले कक्षा की उपस्थिति (होवर पर सेट और माउस आउट एनिमेट कॉलबैक पर हटा दिया गया) के लिए परीक्षण। जब नई एनीमेशन शुरू होता है, तो डेक्यू।

$("div").hover(function(){ 
    if (!$(this).hasClass('animated')) { 
     $(this).dequeue().stop().animate({ width: "200px" }); 
    } 
}, function() { 
    $(this).addClass('animated').animate({ width: "100px" }, "normal", "linear", function() { 
     $(this).removeClass('animated').dequeue(); 
    }); 
});