jQuery - माउस एनीमेशन जारी रखता है जबकि माउस तत्व पर होवर करता है?

Question

मैं 'whileonmouseover' एक एनीमेशन जारी रखने के लिए कार्य करते हैं किसी तरह का प्रदर्शन करने के लिए कोई तरीका होना चाहिए, जबकि एक तत्व पर माउस ओवर ...

उदाहरण के लिए, इस समारोह को देखते हुए:

$(document).ready(function() 
{ 
    function doAlert() 
    { 
     alert(1); 
    } 

    $('#button').hover(function() 
    { 
     doAlert(); 
    }); 
}); 

सूचित करेंगे #button पर माउस hovers के रूप में एक बार आग। मुझे लगता है कि चेतावनी आग करते हुए माउस #button से अधिक बनी हुई है जारी रखने के लिए कोई तरीका होना चाहिए ...

मैं समारोह प्रत्यावर्तन किसी तरह का कर रही जब तक एक ट्रिगर सेट कर दिया जाता चेतावनी जारी रखने के लिए इसे रोकने के लिए पैदा कर रहा कोशिश की है:

$(document).ready(function() 
{ 
    var doLoop = true; 

    function doAlert() 
    { 
     if (!doLoop) return; 

     alert(1); 
     doAlert(); 
    } 

    $('#button').hover(function() 
    { 
     doAlert(); 
    }, function() 
    { 
     doLoop = false; 
    }); 
}); 

लेकिन यह असफल रहा। लगता है कि फ़ंक्शन 'होवर ऑफ' में 'doLoop = false' असाइनमेंट को पूरी तरह से अनदेखा करता है।

इसे पूरा करने का कोई तरीका?

Answer 1

मैं $ (दस्तावेज़) के दायरे से बाहर निम्नलिखित हिस्सा ले जाने के लिए सुझाव है कि .ready() समारोह: मैं था

var doLoop = true; 

function doAlert() 
{ 
    if (!doLoop) return; 

    alert(1); 
    doAlert(); 
} 

$(document).ready(function() 
{ 
    $('#button').hover(function() 
    { 
     doAlert(); 
    }, function() 
    { 
     doLoop = false; 
    }); 
}); 

Answer 2

:

var doLoop = true; 

function doAlert() 
{ 
    if (!doLoop) return; 

    alert(1); 
    doAlert(); 
} 

बजाय इस कोड की कोशिश रिकर्सिंग के बजाए अंतराल सेट करने की अनुशंसा करते हैं क्योंकि, अंतिम समाधान मानना ​​सिर्फ सतर्क नहीं है, लेकिन कुछ नॉन-अवरुद्ध कर रहा है, जबकि होवरिंग के दौरान रिकर्सिंग मेमोरी होगिंग और उत्तरदायीता का कारण बन सकती है।

कुछ की तरह:

var hoverInterval; 

function doStuff() { 
    // Set button's background to a random color 
    $("#button").css("background", "#" + Math.floor(Math.random() * 16777215).toString(16)); 
} 

$(function() { 
    $("#button").hover(
     function() { 
      // call doStuff every 100 milliseconds 
      hoverInterval = setInterval(doStuff, 100); 
     }, 
     function() { 
      // stop calling doStuff 
      clearInterval(hoverInterval); 
     } 
    ); 
});