即使在滚动页面时也可以设置div全屏

我想设置#bodyHider全屏。我想这样的代码：即使在滚动页面时也可以设置div全屏

#bodyHider{ 
    position:absolute; 
     width:100%; 
    height:100%; 
    background:#000; 
    opacity: 0.7; 
    filter: alpha(opacity=70); /* For IE8 and earlier */ 
    z-index:10000; 
}

的HTML代码：

<div id="bodyHider"></div>

它的工作，但是当我向下滚动，我看到#bodyHider是在页面的顶部。即使滚动页面，我也想要整个屏幕。

来源

2016-01-23 Swister

如何只让位置'fixed'和设置'顶部：0;左：0;'。这应该做到这一点。 –

这就是你想要的。

#bodyHider{ 
    position:fixed; 
    top:0; 
    width:100%; 
    height:100%; 
    background:#000; 
    opacity: 0.7; 
    filter: alpha(opacity=70); /* For IE8 and earlier */ 
    z-index:10000; 
}

来源

2016-01-23 13:57:55

感谢它的工作 – Swister

@Swister批准我的答案是很好的，所以大家都知道这很简单。 –

一个小例子，与所述固定的位置。

CSS

html, body { 
height: 100%; 
width: 100%; max-width: 100%; 
} 
body { overflow-x: hidden; } 

#bodyHider{ 
    position:fixed;/* Put the position fixed */ 
    width:100%; 
    height:100%; 
    background:#000; 
    opacity: 0.7; 
    filter: alpha(opacity=70); /* For IE8 and earlier */ 
    z-index:-1; 
} 

#main { 
position:relative: 
height:auto; 
width:100%; 
z-index: 1; 
}

HTML

<body> 
<div id="bodyHider"></div> 
<div id="main"> 
Your content. 
</div> 
</body>

来源

2016-01-23 14:06:03

即使在滚动页面时也可以设置div全屏

回答

相关问题