jQuery-如何抑制mouseleave事件？

Question

我有一個圖像，其中的播放/暫停按鈕位於絕對位置，並且居中位於頂部。

看例子 http://jsfiddle.net/GuJWk/3/

當用戶將鼠標懸停在img上時，該按鈕出現；當鼠標離開圖像時，該按鈕消失。

當用戶將鼠標懸停在按鈕上時，我遇到的問題是閃爍，我懷疑是因為觸發了圖像鼠標移出事件。

我知道問題是什么，什么原因造成的，但我無法解決。 我不想嵌套“暫停播放”按鈕，也不能使其正常工作。 我只需要以某種方式來管理冒泡事件。

謝謝，卡姆

Answer 1

向$('#pauseplay')添加一個.mouseenter事件，該事件會在懸停時取消動畫：

$('#pauseplay').mouseenter(function(){
    $(this).stop(false,false);
}).hide();

演示： http ： //jsfiddle.net/GuJWk/11/

同樣， $().hover(fn1, fn2)是$().mouseenter(fn1).mouseleave(fn2)的簡寫。

Answer 2

這樣可以解決您的問題嗎？

http://jsfiddle.net/eHerL/

$("body").on("mouseover", "img", function(){
    $('#pauseplay').stop(true,true).fadeIn(1000);
}).mouseleave(function(){
    $('#pauseplay').stop(true,true).fadeOut(1000);
});​