覆盖为真时隐藏滚动条

时间:2017-11-02 07:15:19

标签: javascript jquery html css

实际上我已经在我的页面中启用了滚动功能,但是当覆盖设置为true时,滚动条仍然存在。 如果页面上有覆盖图,如何隐藏滚动?



.overlay{
    display: none;
    opacity:0.8;
    background-color:#ccc;
    position:fixed;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    z-index:1000;
}

<div onclick="show_overlay_fn()">
CLICK HERE
</div>
<br>

<div id="overlay" class="overlay"></div>

<script>
function show_overlay_fn(){
	document.getElementById("overlay").style.display = "block";
}
</script>
lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to createlost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars v scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to createlost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars v scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars 
&#13;
&#13;
&#13;

3 个答案:

答案 0 :(得分:4)

您可以使用element.style.overflow并为其指定属性值。我还测试了叠加点击以再次启用溢出。

function show_overlay_fn(){
	document.getElementById("overlay").style.display = "block";
    document.getElementsByTagName("body")[0].style.overflowY = 'hidden';
}
//click listener for overlay
document.getElementById('overlay').addEventListener('click',function(){
  document.getElementById("overlay").style.display = "none";
  document.getElementsByTagName("body")[0].style.overflowY = 'auto';
});
.overlay{
    display: none;
    opacity:0.8;
    background-color:#ccc;
    position:fixed;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    z-index:1000;
}
<div onclick="show_overlay_fn()">
CLICK HERE
</div>
<br>

<div id="overlay" class="overlay"></div>

lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to createlost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars v scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to createlost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars v scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars

答案 1 :(得分:0)

添加另一个类以冻结正文

body.freeze-scroll {
  overflow: hidden;
}

然后在点击功能

上添加此项
$('body').toggleClass('freeze-scroll');

答案 2 :(得分:0)

您也可以使用css()

上的click function这样做

.overlay{
    display: none;
    opacity:0.8;
    background-color:#ccc;
    position:fixed;
    width:100%;
    height:100%;
    top:0px;
    left:0px;
    z-index:1000;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="overlay-click" onclick="show_overlay_fn()">
CLICK HERE
</div>
<br>

<div id="overlay" class="overlay"></div>

<script>
function show_overlay_fn(){
	document.getElementById("overlay").style.display = "block";
}


$('.overlay-click').click(function(){
  $('body').css("overflow","hidden")
});

</script>
lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to createlost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars v scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to createlost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars v scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars lost of text to create scrollbars