javascript - 检查鼠标是否在 div 上

Question

如何检查我网站上的 div 上是否有鼠标？我需要不断的验证。如果鼠标悬停在 div 内容上，则内容消失。

出现的内容还需要包含/允许链接。

Answer 1

只是检查$(select).is(':hover')

Answer 2

如果你愿意，你可以在没有 JavaScript 的情况下做到这一点。Div 对:hover伪类的响应。

您可以执行以下操作：

#myCoolDiv {
    /*Styles go here*/
    display: none;
}
#myCoolDiv:hover {
    display: block /*Or whatever display type you want*/
}

当然，这会使 div 完全消失。如果您希望某些文本可见并且其中一些在悬停之前不可见，则可以将悬停分配给 div 内的某些文本。

有关将鼠标悬停在 MDN上的更多详细信息。

Answer 3

展示演示

jQuery：

$(document).on({

    mouseenter: function () {

        alert("Hello");

    },
    mouseleave: function () {

        // alert("Bye");
    }
}, "#div");

Answer 4

我在这里为这段代码提供资金，但这只会给我鼠标位置，在窗口中，而不是相对于 div

  <script language="JavaScript">
        var IE = document.all ? true : false;
        if (!IE) {
            document.captureEvents(Event.MOUSEMOVE)
        }

        document.onmousemove = getMouseXY;

        var tempX = 0;
        var tempY = 0;

        function getMouseXY(e) {
            if (IE) {// grab the x-y pos.s if browser is IE
                tempX = event.clientX + document.body.scrollLeft;
                tempY = event.clientY + document.body.scrollTop;
            } else {// grab the x-y pos.s if browser is NS
                tempX = e.pageX;
                tempY = e.pageY;
            }
            if (tempX < 0) {
                tempX = 0;
            }
            if (tempY < 0) {
                tempY = 0;
            }
            document.Show.MouseX.value = tempX;
            document.Show.MouseY.value = tempY;
            return true;
        }
    </script>

Answer 5

签出 css:hover选项链接。您可以将其作为一种样式应用于 div、链接等任何您需要的东西。这是当鼠标悬停在元素上时触发的。

Answer 6

使用 css 样式（最简单的方式）例如，当我们将鼠标悬停时，背景将变为蓝色

在您的页面中：

<div id="my_div">This text is in my div!</div>

在您的 css 文件中：

#my_div {
background-color: white;
}

#my_div:hover {
background-color: blue;
}

当然你也可以用 javascript 检查它。