jQuery setTimeout

Question

मैं इस टूलटिप कोड करने के लिए एक समय समाप्ति को जोड़ने के लिए है, तो यह केवल प्रदर्शित करता है थोड़ी देर के बजाय तुरंत से के बाद माउस यह पर घूमता है, तो चाहता हूँ ... मैं setTimeout() जोड़ने की कोशिश की, लेकिन मैं समझ नहीं सकता कैसे उपयोग करने के लिए clearTimeout() इसलिए टूलटिप माउसआउट पर छिपा नहीं है। क्या आप मदद कर सकते हैं?

// ----------------------------------------------- 
// TOOLTIP MOUSE HOVER 
// ----------------------------------------------- 
function mcTooltip() { 
    $('.mcTxb').mousemove(function(e) { 
     var mcHoverText = $(this).attr('alt'); 
     var mcTooltip = $('.mcTooltip'); 
     $(mcTooltip).text(mcHoverText).show('fast'); 
     $(mcTooltip).css('top', e.clientY + 10).css('left', e.clientX + 10); 
    }).mouseout(function() { 
     var mcTooltip = $('.mcTooltip'); 
     $(mcTooltip).hide('fast'); 
    }); 
} 
mcTooltip(); 

मैं इस कोशिश की:

// ----------------------------------------------- 
// TOOLTIP MOUSE HOVER 
// ----------------------------------------------- 
function mcTooltip() { 
    $('.mcTxb').mousemove(function(e) { 
     var mcHoverText = $(this).attr('alt'); 
     var mcTooltip = $('.mcTooltip'); 
     setTimeOut(function(){ 
      $(mcTooltip).text(mcHoverText).show('fast'); 
     }, 300); 
     $(mcTooltip).css('top', e.clientY + 10).css('left', e.clientX + 10); 
    }).mouseout(function() { 
     var mcTooltip = $('.mcTooltip'); 
     $(mcTooltip).hide('fast'); 
    }); 
} 
mcTooltip(); 

Answer 1

आप एनीमेशन का उपयोग कर रहे हैं, आप .delay() का उपयोग अपने टूलटिप की उपस्थिति को स्थगित करने कर सकते हैं:

$(mcTooltip).text(mcHoverText).delay(1000).show('fast'); 

अपने mouseout समारोह में, .stop का उपयोग किसी भी मौजूदा देरी या रद्द करने के लिए एनिमेशन, और फिर टूलटिप छिपाने :

$(mcTooltip).stop(true).hide('fast'); 

Answer 2

एक विकल्प आप क्या चाहते हैं पूरा करने के लिए hoverIntent प्लगइन का उपयोग करने के लिए है।

Answer 3

1. उपयोग hover() बजाय, यह कम कोड है (और है कि, हमेशा अच्छा है IMO)।

तो जैसा:

function mcToolTip() { 
    $(".mcTxb").hover(function(){ 
     // mouseover stuff here 
     $("element").delay(3000).show(); // 3 second delay, then show 
    }, function(){ 
     // mouseout stuff here 
    }); 
} 

Answer 4

var my_timer; 
$('.mcTxb').hover(
    function() { 
     my_timer = setTimeout(function() { 
      //do work here 
     }, 500); 
    }, 
    function() { 
     clearTimeout(my_timer); 
    } 
); 

यह जो कुछ करने से पहले आधे सेकंड इंतजार करेंगे जब आप mouseover तत्व और जो कुछ नहीं होगा यदि आप mouseout आधे के भीतर दूसरा ।

Answer 5

यह सवाल पुराना है, लेकिन मैंने सोचा कि मैं दूसरों के लिए यह जवाब। टाइमआउट काम नहीं कर रहा था मुख्य कारण "setTimeOut" का मामला था। आप ऊपरी हिस्से को ऊंट नहीं कर सकते हैं। इसका "सेटटाइमआउट"।

Answer 6

सेटटाइमआउट माउसओवर या होवर पर काम नहीं करता है। यह उपयोग करने के लिए सुरक्षित है। डेले()।

setTimeout(function(){ 
    $(mcTooltip).text(mcHoverText).show('fast'); 
}, 300); 

// use this instead. 

$(mcTooltip).text(mcHoverText).delay(3000).show('fast');