क्या मैं jQuery में .animate() के साथ .delay() का उपयोग कर सकता हूं?

Question

मेरे पास यह कोड है, जो एक वेबसाइट पर एक टोकरी पूर्वावलोकन खोलता है जिस पर मैं काम कर रहा हूं। यदि उपयोगकर्ता उस पर आच्छादित है, तो यह खुला रहता है, लेकिन मुझे लगता है कि मेरे होवर के लिए कॉलबैक ट्रिगर होने से पहले दो सेकंड की देरी होनी चाहिए। यह सिर्फ तभी होता है जब उपयोगकर्ता नहीं चाहता कि माउस टोकरी क्षेत्र छोड़ दे।

नीचे कोड मैं टोकरी चेतन करने के लिए उपयोग कर रहा हूँ है:

$('.cart_button, .cart_module').hover(function(){ 
    $(".cart_module").stop().animate({top:'39px'},{duration:500}); 
}, function(){ 
    $('.cart_module').stop().animate({top: -cartHeight},{duration:500}) 
}); 

यहाँ कोड मैं का उपयोग करने की कोशिश की है, लेकिन कोई को प्रभावित किया था:

$('.cart_button, .cart_module').hover(function(){ 
    $(".cart_module").delay().animate({top:'39px'},{duration:500}); 
}, function(){ 
    $('.cart_module').delay().animate({top: -cartHeight},{duration:500}) 
}); 

Answer 1

मैं हमेशा इस प्रबंधित किया है कोर setTimeout और clearTimeout जेएस फ़ंक्शंस की सहायता से चीजों की तरह।

यहाँ यह आप हॉवर पर और बाहर की घटनाओं

Answer 2

कब तक आप इसके लिए देरी करना चाहते हैं एक टाइमआउट देता है, एक example on jsFiddle

भी jquery.hoverIntent plugin पर एक नजर डालें है ????

$('.cart_button, .cart_module').hover(function(){ 
      $(".cart_module").delay(2000).animate({top:'39px'},{duration:500}); //two seconds 
     }, function(){ 
      $('.cart_module').delay(2000).animate({top: -cartHeight},{duration:500}) //two seconds 
    }); 

Answer 3

आप बंद देरी से पहले यह सिर्फ ठीक काम करता है जोड़ते हैं:

$('.cart_button, .cart_module').hover(function() { 
    $('.cart_module').stop(true, true).delay(100).animate({top:'39px'}, 400); 
    }, 
    function() { 
    $('.cart_module').stop(true, true).animate({top: -cartHeight}, 250); 
}); 

Answer 4

ऐसा लगता है कि 2011 क्रोम में के बाद से इस नस में jQuery के लिए अद्यतन किया गया है मई मैं उपयोग कर सकते हैं इस बिना समय-समाप्त हुआ कॉल:

$('.thing').hover(function(){ 
    $(".thing").delay(2000).animate({top:'39px'},{duration:500}); 
}