jquery - 当鼠标移动且未悬停在 div 上时淡入内容

Question

我试图在鼠标移动时淡入内容(类似于 Google 主页的方式)，但是如果鼠标光标悬停在特定 div 上，我想阻止这种行为。

这是基础知识:

$("html").hover(function() {
    $("#navigation, #content").fadeIn("slow");
});

这成功地淡入了内容。我一直在尝试检测光标何时位于某个元素上，但没有效果。这就是我所拥有的:

$("html").one("mousemove", function() {
    if (mouseover == false) {
        $("#navigation, #content").fadeIn("slow");
    }
});

var mouseover = false;
$('#hero').mouseenter(function() {
    mouseover = true;
}).mouseleave(function() {
    mouseover = false;
});

可能有比我这里更好的方法来完成此任务吗？

Answer 1

尝试使用 jQuery 的 stopPropagation() hero 元素上的 mousemove 处理程序上的方法。这应该会阻止事件冒泡到文档级别，该事件将由更通用的函数处理。

请注意，我个人从未这样做过，但我对 javascript 中事件冒泡的理解以及 stopPropagation() 方法的目的是它应该为您执行此操作。