JavaScript   发布时间:2022-04-16  发布网站:大佬教程  code.js-code.com
大佬教程收集整理的这篇文章主要介绍了javascript – jquery绝对定位元素单击大佬教程大佬觉得挺不错的,现在分享给大家,也给大家做个参考。
我有一个绝对定位div的点击问题.我正在开发一个带有 jquery scrollpath的网站,并添加额外的图层以获得主要层中的视差效果和顶层覆盖按钮,它们无法点击,悬停等等.

Here简单的例子

<div class="body">
<div class="a"></div>
<div class="b">
    <div class="element first">First</div>
    <div class="element second">Second</div>
</div>
</div>

.body {
    position relative;
}
.a {
    position: absolute;
    left: 20px;
    top: 20px;
    width: 300px;
    height: 600px;
    BACkground: rgba(0,0.5);
    z-index: 2;
}
.b {
    position: absolute;
    left: 40px;
    top: 40px;
    width: 260px;
    height: 300px;
    BACkground: blue;
    z-index: 1;
}
.b .element {
    position: absolute;
    width: 50px;
    height: 50px;
    BACkground: red;
}
.b .element.first {
    top: 50px;
    left: 50px;
}
.b .element.second {
    bottom: 50px;
    right: 50px;
}
}

我需要保持这个html结构和能力点击具有较低z-index的绝对定位div中的div.可能吗?

解决方法

您可以在upper元素上将pointer-events设置为none,以阻止它对鼠标事件做出反应.
pointer-events:none;

JSFIDDLE http://jsfiddle.net/ugGgN/5/

如今,跨浏览器支持非常好:http://caniuse.com/#feat=pointer-events

有关指针事件的更多信息,请参阅文档:https://developer.mozilla.org/en/docs/Web/CSS/pointer-events?v=example

大佬总结

以上是大佬教程为你收集整理的javascript – jquery绝对定位元素单击全部内容,希望文章能够帮你解决javascript – jquery绝对定位元素单击所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错,欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。