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;
}

Answer 2

如果您创建的是全宽度＆amp;您的页面高度并赋予它比整个页面更高的z索引，您可以创建此效果。然后把你出现的div放在上面。

Answer 3

只需使用页面大小的全局div来覆盖任何其他内容：

http://jsfiddle.net/CHkNd/1/

Answer 4

以下是您可以使用的示例。

http://jsfiddle.net/r77K8/1/

希望这有帮助。

鲍勃

在CSS中创建叠加层？

4 个答案: