另一个“;z索引不起作用”;在IE中>7、研究后找不到答案

another "z-index not working" in IE > 7, cannot find answer after research

本文关键字：gt 答案 找不到 索引 不起作用 IE 另一个      更新时间：2023-09-26

我到处找，找到了很多文章，解释了IE 7,8和9 z索引问题的工作，但这些案例都没有解决我的问题。

问题是我在页面中间有用户可以交互的内容，但我不希望用户在页面加载后2秒才能交互（不需要帮助）。因此，我使用了一个拦截器作为解决方案，一个位于HTML中动画内容上方的div，具有绝对位置，并覆盖用户交互，因此您不能将鼠标悬停在动画上。

这适用于Chrome和Firefox，但所有IE都存在z索引问题。

我确保每个父元素都有一个相对或绝对的位置，甚至尝试将父容器设置为更高的索引，反之亦然。有人遇到过这样的问题吗？

我不能显示私人事务的代码，但我已经充分解释了，我希望。

有任何问题，请告诉我。

在IE中，我注意到，即使将父元素设置为相对和/或绝对位置，并且它们的z索引低于阻塞div（这是一个正常的修复），阻塞div仍然作为一个单独的索引堆叠，因此不会堆叠在上面的其他元素之上。我注意到的另一个问题是，当您将阻止程序背景颜色设置为一种颜色时，z索引堆栈可以工作，并且您无法与较低的z索引元素交互。但当您将空拦截器设置为透明时，z索引将不会和其他元素堆叠（bug）。

如果您试图使用空div来阻止用户交互（否则，以上应该有效），以下是适用于所有IE浏览器的解决方法：

CSS

#blocker {
    position:absolute;
    width: 100%;
    height: 200%;
    top:0px;
    right:0px;
    bottom:0px;
    left:0px;
    z-index:9999;
    background-image: url('/cont-img/Transparent.gif');
    background-repeat:repeat;
}
  1. 下载与opacity 0类似的透明gif，但适用于所有IE浏览器：transparent.gif
  2. 重复gif背景，使其重复x&y在上述元素上

HTML

    <!-- place empty blocker div BELOW content trying to block -->
    <div id="blocker"></div>
相关文章：