当登录表单弹出时,reddit如何使整个背景变黑？

Question

当你点击reddit注册按钮时,会弹出一个漂亮的窗口,屏幕的其余部分会变黑.您可以单击屏幕的其余部分以关闭弹出窗口.

我知道我可以使用最外层的div,但是reddit是怎么回事？他们是否也在改变那个外部div的属性呢？

Answer 1

这种技术被称为overlay并且实现起来非常简单:

#overlay {
    position: fixed;
    z-index:103;
    top: 0px;
    left: 0px;
    height:100%;
    width:100%;
    background-color: gray;
    opacity: 0.7;
}

显示它的完整行为被称为模态窗口.

查看上面CSS的实时示例.

但是,考虑到所有事情都要使浮动DIV具有表格等等,您将要使用已经为此制作的众多插件中的一个,例如Thickbox或jqModal.