Question

我正试图在它下面有一个coverUp div eclipse另一个div。然后我将coverUp的背景设置为透明。这使div下方可见，但用户无法与之交互。可悲的是，这不是IE中发生的事情。

将coverUp div设置为透明后，IE中的用户可以访问eclipsed div（包括10）。有解决方案吗？

<div class="coverUp"></div>
<div id="mapDiv"></div>

.coverUp {
    background-color: transparent;
    position: absolute;
    top: 0;
    height: 100%;
    width: 100%;
    left: 0;
    cursor: pointer;
    z-index: 50;
}

编辑：无法使用不透明度，因为我在coverUp Div中有子元素，当我应用不透明度时会淡出：0。

Answer 1

而不是透明，你可以使用不透明度：0;这仍然会将div作为块元素。

此外，您可能希望将z-index设置为99999以强制它超过页面上每个其他元素的顶部。

Answer 2

您可以使用以下css标记创建透明但具有背景颜色的内容。

    background-color: rgba(255,255,255,0);

前3个参数是转换为十进制的十六进制数，第四个是透明度。我不知道它是否以与设置opacity: 0相同的方式改变不透明度，你可能不得不试一试，我不知道页面上应该是什么

我在IE9中用fiddler (link)测试了它，但是fiddler在IE7中加载页面时遇到了问题。 8，所以我不幸地测试了它们。

Answer 3

由于css tricks，我能够解决这个问题。

我添加了这个，

background:url("datdata:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7");

这是example。

注意：jsfiddle在IE8中没有打开（至少在IE10浏览器的IE8模式下没有为我打开）。因此，在您的代码中进行此更改并进行检查。

IE中可访问透明背景元素下方的元素

3 个答案: