Javascript 是否可以在透明div上跟踪悬停，而不影响其覆盖的任何元素？

我想在页面上放置一个100px x 100px的透明div

我想跟踪鼠标是否悬停在它上面

我不希望这个透明的div影响页面上它可能“覆盖”的任何元素，即阻止可能附加到这些元素的任何悬停/单击事件（我无法知道哪些事件可能附加到这些元素，如果有的话）

---

使用javascript/jQuery是否可以实现这一点？

因此您希望div下的元素不会触发任何悬停事件，但希望跟踪鼠标在透明div上的位置？你想如何追踪它？听起来你也许可以用CSS（z-index）来实现。jquery文档中可能也有事件。下面可能是CSS

#myDiv
{
    Z-index:1000;
}

#myDiv:hover
{
    Background-color:red;
}

#underDiv
{
    Z-index:1;
}

---

根据您需要的浏览器支持级别，您可以考虑CSS属性<代码>指针事件< /> >（注意仅在IE 11中支持）：

---

在支持/实现CSS

指针事件的浏览器中

可以将属性设置为

none

，以允许指针的行为基本上“通过”元素。例如：

<ul>
    <li>one</li>
    <li>two</li>
    <li>three</li>
</ul>
<img src="http://placekitten.com/300/300" />

以及jQuery：

$('li').click(function(){
    console.log(this.textContent);
});

（仅在Chrome 31/Win XP中测试）

单击事件在绝对定位图像下方的

li

元素上激发

对于相同的HTML和CSS，以下jQuery还允许使用

hover（）

方法：

$('li').hover(function(){
    console.log(this.textContent);
});

参考资料：

---

您想要实现什么目标？如果要在某个页面区域上跟踪鼠标，最好在该div本身上注册处理程序。如果您能提供更清晰的信息，可能会帮助我更好地回答问题。如果您关闭指针事件，如何跟踪悬停？ISTM OP的整个方法都是错误的，背景中的一个元素应该监听mousemove事件，而不是顶部的透明元素。

$('li').click(function(){
    console.log(this.textContent);
});

$('li').hover(function(){
    console.log(this.textContent);
});