html 动态遮罩层 js+html实现遮罩层效果（收藏哦）

//遮罩

function coverDiv(){

var procbg = document.createElement("div"); //首先创建一个div

procbg.setAttribute("id","mybg"); //定义该div的id

procbg.style.background = "#000000";

procbg.style.width = "100%";

procbg.style.height = "100%";

procbg.style.position = "fixed";

procbg.style.top = "0";

procbg.style.left = "0";

procbg.style.zIndex = "500";

procbg.style.opacity = "0.6";

procbg.style.filter = "Alpha(opacity=70)";

document.body.appendChild(procbg);

}

//取消遮罩

function hide() {

/* document.getElementById('light').style.display="none"; */

$("div[class='xucun_content']").hide();

var body = document.getElementsByTagName("body");

var mybg = document.getElementById("mybg");

body[0].removeChild(mybg);

}

解释：实现的方式很简单，就是动态创建一个div，设置的背景颜色等等，如果你是弹出一个框框，并且在框没有关闭之前是不能操作父级元素的，那么你就可以让你的框和这个遮罩div同时显示，而只需要设置他们的z-index样式，来选择谁在上在下的顺序，就可以啦！

欢迎加入Java交流群：398918539