javascript - Z-index 没有按预期工作？

Question

我在这个网站上工作http://www.group---me.my/national/

请删除 --- 在网址中。

对于某些交易，有选项，当您单击 BuyNow 按钮时，会出现一个弹出窗口。我想在显示弹出窗口时使背景变暗（变暗）。

为此，在我的本地测试站点上，我添加了以下 div 类：

    .overlay{
        display: none;
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 333%;
        background-color: black;
        z-index: 20;
        opacity: 0.8;
        filter: alpha(opacity=80);
    }

然后在“立即购买”按钮上，我添加了

    onclick="javascript:document.getElementById('fade').style.display='block';"

我在网站上也有这个

    <div id="fade" class="overlay"></div>

但问题是，叠加层总是隐藏所有图层，包括弹出窗口，无论我将弹出窗口 div 的 z-index 设置多高。

任何帮助深表感谢。谢谢。

Answer 1

如果您没有指定某些父元素相对定位，则您的叠加 div 将相对于 body 定位，因此它可以位于所有其他内容之上。

Answer 2

哪个浏览器？哪个版本。我在这里得到它。应该隐藏吧？

而且很突出。你想在这里做什么？