检查鼠标是否超过元素jQuery

时间:2013-04-07 13:13:55

标签: jquery hover position element offset

我想检查鼠标当前是否在div的可见区域内。 我知道我可以使用以下代码:

$("#div").is(":hover");

在jQuery中。

但是,我的#div可能还有另一个div,因此悬停对我的情况不起作用。

我需要检查鼠标是否在元素上方,而不管它上面是否有任何元素(防止悬停检查)。

1 个答案:

答案 0 :(得分:0)

如果您不需要将任何操作应用于相关div上方的元素,您可以简单地将指针事件:none应用于它。这应该可以解决你的问题,你应该可以使用$('#div')。hover()完全没问题。

测试示例。

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>TEST</title>
    <style>
        div {
            width:50px;
            height:50px;
            position:absolute;
        }
        div#one {
            top:0;
            background:orange;
        }
        div#two {
            top:20px;
            background:blue;
            opacity:1;
            pointer-events:none;
        }
    </style>
</head>
<body>
    <div id="one">
    </div>
    <div id="two">
    </div>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>
    $(function(){
        $('div#one').click(function(){
            alert('one-clicked');
        });
        $('div#one').hover(function(){
            console.log('one is being hovered!')
        });
    });
    </script>
</body>
</html>

一切顺利, 沙洛姆