問題與jquery中的鼠標事件

我已經創建了一個使用JS API的自定義YouTube播放器。我試圖淡出玩家控制，當我從玩家mouseout和麪對面當我mousein玩家。問題與jquery中的鼠標事件

以下是我用過的jQuery代碼。

$("#video-container, #ytPlayer").on('mouseover', function(){ 
    $('#video-controls').fadeIn(500); 
}).on('mouseout', function() { 
    $('#video-controls').fadeOut(500); 
});

演示網址：http://staging.xhtml-lab.com/tik-o-talk/

的鼠標事件都不能正常工作，有什麼建議嗎？

來源

2013-02-10 Alok Jain

更常見的是，您應該使用'mouseleave'來代替'mouseout'，以避免事件冒泡引起的複雜情況。如果使用'mouseout'，處理器不僅在鼠標離開主元素時觸發，而且在鼠標離開任何子元素時纔會輸入另一個子元素，這是您很少需要的東西。 – SexyBeast 2013-02-10 06:41:56

$("#video-container, #ytPlayer").on('mouseenter mouseleave', function(e){ 
    var fadeOpacity = e.type == 'mouseenter' ? 1 : 0 ; 
    $('#video-controls').stop().fadeTo(500, fadeOpacity ); 
});

的MouseEnter和鼠標移開是hover方法的兄弟，併爲進入/離開元素時更可靠，比增加了一點.stop()清除動畫隊列和美妙fadeTo()方法應該是櫻桃給我們食譜。

來源

2013-02-10 06:05:45

您必須通過'true'到'stop（）'清除隊列。 – Musa 2013-02-10 06:10:30

@Musa，這是不正確的。如果它是關於誤解的話，那麼比我提到的'隊列'意味着'積累'，如果這使得這個術語更清晰一點。 – 2013-02-10 06:10:53

@Musa，如果仔細閱讀DOCS，您會看到'當調用.stop（）時，隊列中的下一個動畫立即開始。「這意味着先前動畫的隊列被清除，而不會創建動畫堆積。如我錯了請糾正我：） – 2013-02-10 06:13:57

問題與jquery中的鼠標事件

回答

相關問題