Question

目前我的困境是我有一个div绝对坐在我的所有代码之上（它有一个滑动动画）但是我现在无法访问顶部div后面的内容..

这有动画，但没有链接或按钮可以使用：http://oxygenrad.io/index.php

这没有动画div，并且有工作链接和按钮：http://oxygenrad.io/index-2.php

造成我所有问题的div如下：

<div class="reveal open">
</div>

我明白我可以在XX秒之后销毁div，但理想情况下我想知道是否有更好的解决方案？我想要做的就是点击div。

Answer 1

在div上使用pointer-events: none;，如下所示：

.opened {
  background: url(http://uploadir.com/u/9btuxs9t) 0px 660px, url(http://uploadir.com/u/9btuxs9t) 0px -735px;
  pointer-events: none;
  background-repeat: no-repeat;
}

pointer-events属性允许控制HTML元素如何响应鼠标/触摸事件 - 包括CSS悬停/活动状态，Javascript中的点击/点击事件，以及光标是否可见。

对于IE11，您可以使用：

filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='your_transparent.png', sizingMethod='scale');
background: none !important;

Answer 2

您可以尝试使用pointer-events: none（有关详细信息，请参阅mdn页面）。但要注意它will not work with IE < 11。

Answer 3

而不是某些人建议的pointer-events: none;，只需将z-index:0;添加到您的.opened课程。适用于所有旧版浏览器，而pointer-events则不适用。

使绝对div空洞？

3 个答案: