遮罩效果当前在很多应用中都有使用，当然也比较简单，无非是在需要的时候出现一个具有透明效果的全屏元素，但是有一种情况需要特别注意一下，那就是页面出现滚动条的时候，这个时候如不进行一下处理，遮罩层效果的表现可能不伦不类。
代码如下:
蚂蚁部落 *{ margin:0px; padding:0px; } .zhezhao{ width:100%; height:100%; background-color:#000; filter:alpha(opacity=50); -moz-opacity:0.5; opacity:0.5; position:absolute; left:0px; top:0px; display:none; z-index:1000; } .login{ width:280px; height:180px; position:absolute; top:200px; left:50%; background-color:#000; margin-left:-140px; display:none; z-index:1500; text-align:right; } .content{ margin-top:50px; color:red; line-height:200px; height:200px; text-align:center; } window.onload=function(){ var zhezhao=document.getElementById("zhezhao"); var login=document.getElementById("login"); var bt=document.getElementById("bt"); var btclose=document.getElementById("btclose"); bt.onclick=function(){ zhezhao.style.display="block"; login.style.display="block"; } btclose.onclick=function(){ zhezhao.style.display="none"; login.style.display="none"; } }
查看更多关于可以防止滚动条影响的全屏遮罩效果_html/css_WEB-ITnose的详细内容...
声明：本文来自网络，不代表【好得很程序员自学网】立场，转载请注明出处：http://haodehen.cn/did110640