Html 出现弹出窗口时使用 css 禁用背景
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/17103723/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
disable background using css when popup appear
提问by Milton
I am using the below css code to block the entire page when the popup appeared. But it's working(The visible page only covered not all). I have a problem, if my page having a scroll bar means the remaining bottom of the page not covered by the blocker.
当弹出窗口出现时，我使用下面的 css 代码来阻止整个页面。但它正在工作（可见页面仅涵盖并非全部）。我有一个问题，如果我的页面有滚动条意味着页面的剩余底部未被拦截器覆盖。
.parentDisable
{
z-index: 99999;
width: 100%;
height: 100%;
display: none;
position: absolute;
top: 0%;
left: 0%;
background-color: #000;
color: #aaa;
opacity: 0.8;
filter: alpha(opacity=100);
}
#popup
{
width: 300;
height: 300;
position: relative;
color: #000;
top: 25%;
}
回答by Abdul Malik
use this css
使用这个 css
.parentDisable{
position: fixed;
top: 0;
left: 0;
background: #000;
opacity: 0.8;
z-index: 998;
height: 100%;
width: 100%;}
#popup{
position: absolute;
z-index: 999;}
and this html
和这个 html
<div class="parentDisable"></div>
<div id="popup">My pop up</div>
