javascript - 在 CSS 中创建叠加层？

Question

我有一个 div，它会在某些情况出现时动态显示。

当我显示div时，如何创建背景变暗和我的div显得突出的效果？很像许多 AJAX 灯箱或弹出窗口。 (Thickbox、ColorBox、PrettyPhoto 等)

我不太明白他们是怎么做到的。除了那部分，我还有其他所有东西都在我自己的自定义代码中工作。

谁能帮我学习如何做？

Answer 1

在内容上放置一个 div 并设置不透明度。我在我的一个网站中使用它。

<div id="error_wrapper">
    <div id="site_error">
        Error:
    </div>
</div>

div#error_wrapper {
    z-index: 100;
    position: fixed;
    width: 100%;
    height: 100%;
    background-color: #000000;
    top: 0px;
    left: 0px;
    opacity: 0.7;
    filter: alpha(opacity=70);

}

div#site_error {
    position: fixed;
    top: 200px;
    width: 400px;
    left: 50%;
    margin-left: -200px;
}