如果鼠标未悬停元素则淡出

Question

基本上，如果 x 秒后没有触发鼠标悬停事件，我想淡出一个元素。我已经尝试了几个小时，但似乎无法编写正常工作的代码。

到目前为止我已经写过——

$('.toolTip').live('mouseover', function() {
    $(this).stop(true, true).fadeIn();
});
$('.toolTip').live('mouseleave', function() {
    $(this).delay(4000).fadeOut("slow");
});

如果鼠标进入 div 然后离开，则该方法有效，但如果它没有获得焦点则无效。

Answer 1

该mouseover事件永远不会在 .toolTip div 上调用，因为fadeOut()它将通过应用于display:none该元素来完成，从而防止您再次将鼠标悬停在它上面。您可以使用 fadeTo() 来更改其不透明度，而不影响其显示属性，而不是 fadeOut()。

\n\n

$(document).on(\'mouseover\', \'.toolTip\', function() {\n    $(this).stop().fadeTo("fast", 1);\n});\n\n$(document).on(\'mouseleave\', \'.toolTip\', function() {\n    $(this).delay(4000).fadeTo("slow", 0);\n});\xe2\x80\x8b\n

\n