jQuery-css在较高的Z索引上禁用div



我的问题:是否可以禁用div(Z-index 2),使其仍然可见,并使其被鼠标"不引人注意",这样我就可以通过它实现鼠标操作(鼠标悬停,点击)到下面启用的div?这意味着你可以点击下面的div,因为你的鼠标在禁用的div的顶部,或者鼠标悬停在顶部的div上,这并不重要,也不会影响下面的div调用的鼠标悬停操作。

问题:我在网上和stackoverflow上搜索过,找不到我想要的简单答案。我有几个div,其中一些在不同的Z-index上相互重叠,顶部的div会打乱下面的div的操作。

示例:-我在下面的div(Z-Index 1)中有一个很好的图形框,其中包含鼠标悬停操作。当鼠标悬停在框上时,它会触发操作。--我在新层(Z-Index 2)的div上的框上也有一些漂亮的图形文本,但这会干扰下面框上的鼠标悬停操作。这看起来像是我的鼠标离开了盒子,但事实并非如此——它只是在更高级别的div上。

问题摘要: 我是否可以禁用div,使其不可点击或触发鼠标悬停调用,但仍然可见

是的,您可以使用以下CSS属性:

pointer-events: none;

这取决于你的目标浏览器。不会说这个属性得到了很好的支持。

请参阅:http://caniuse.com/pointer-events

您是否尝试使您的第2级div实际上是第1级的子级?您应该跟踪mouseenter/mouseleave,而不是mouseover/mouseout

小的解释:只要你的鼠标没有直接在捕捉到的事件目标上,mouseout就会被触发,即使你的指针越过了目标的子对象。对于mouseleave,只有当鼠标指针离开目标元素及其任何子元素时才会触发它。把它想象成mouseenter类似于CSS:hover

相关内容

  • 没有找到相关文章

最新更新