jQuery माउसओवर mouseout पर चलता है

Question

यहाँ मेरी jQuery

$('#samsungShine').mouseover(function() { 
    $('#samsungShineImage').animate({ 
     "margin-left": "304px" 
    }, 700); 
}).mouseout(function() { 
    $('#samsungShineImage').css("margin-left", "-304px"); 
}); 

है जब मैं माउस ले जाएंगे, यह उत्कृष्ट काम करता है, जब मैं mouseout, इसे रीसेट नहीं है, यह फिर से खेलता है माउसओवर ... यहाँ की एक बेला है समस्या आप देख सकते हैं तो मैं क्या मतलब है:

http://jsfiddle.net/2tujd/

Answer 1

भी stop का उपयोग कर इस प्रयास करें,:

DEMO

$('#samsungShine').mouseenter(function() { 
    $('#samsungShineImage').animate({"margin-left":"304px"}, 700); 
}).mouseleave(function(){ 
    $('#samsungShineImage').stop().css("margin-left", "-304px"); 
}); 

Answer 2

बजाय mouseenter और mouseleave का प्रयास करें: http://jsfiddle.net/2tujd/11/

$('#samsungShine').mouseenter(function() { 
    $('#samsungShineImage').animate({ 
     "margin-left": "304px" 
    }, 700); 
}).mouseleave(function() { 
    $('#samsungShineImage').stop().css("margin-left", "-304px"); 
}); 

jQuery site पर, यह mouseover के लिए mouseout और simliarly उपयोग के बारे में कहते हैं:

इस घटना प्रकार कारण घटना बुदबुदाती के लिए कई सिर दर्द हो सकता है। उदाहरण के लिए, जब माउस पॉइंटर इस उदाहरण में आंतरिक तत्व से बाहर निकलता है, तो उस पर माउसआउट ईवेंट भेजा जाएगा, फिर बाहरी पर ट्राइकल करें। यह बाध्य माउसआउट हैंडलर को अप्रचलित समय पर ट्रिगर कर सकता है।

संपादित करें:mouseleave अंदर .stop() जोड़े यकीन है कि किसी भी वर्तमान एनीमेशन margin-left की स्थापना करने से पहले बंद कर दिया जाता है बनाने के लिए।

Answer 3

http://jsfiddle.net/2tujd/10/

मुझे लगता है कि इसके बेहतर सिर्फ एक हैंडलर का उपयोग करना। तो आपके पास एसिंक्रोनस विधियों के साथ कोई बुलबुला या समस्या नहीं है।

$('#samsungShine').mouseenter(function() { 
    $('#samsungShineImage').animate({ 
     "margin-left": "304px" 
    }, 700, function() { 
    $('#samsungShineImage').css("margin-left", "-304px") 
    }); 
});