可以防止滚动条影响的全屏遮罩效果_html/css_WEB-ITnose

上面的代码中，点击按钮可以弹出遮罩层效果，但是向下拖动滚动条，则会发现下面的部分并没有遮罩，那么此效果也就失败了，代码修改如下:

在上面的代码中，当点击按钮弹出遮罩层的时候设置body的高度为100%，设置值为100%可以使body的高度和浏览器客户区的高度相同，然后设置overflow属性值为hidden，这样的话超出的部分就会被隐藏，于是弹出遮罩层的话，也就不会出现滚动条了，点击关闭遮罩层的时候，再将一切恢复原状。需要特别注意的是css中添加了如下代码:

html{height:100%}

具体相关内容可以参阅设置html,body高度100%的作用一章节。

原文地址是:http://www.softwhy.com/forum.php?mod=viewthread&tid=14507

更多内容可以参阅:http://www.softwhy.com/divcss/