html遮罩层的一种实现方式

// 隐藏 select
function selecthidden(){
 var  input_elements=document.getElementsByTagName("select");
 var  theLength=input_elements.length;
 for(i=0;i<theLength;i++)
 {
  input_elements[i].style.visibility="hidden";
  }
}
// 显示 select
function selectshow(){
 var  input_elements=document.getElementsByTagName("select");
 var  theLength=input_elements.length;
 for(i=0;i<theLength;i++)
 {
  input_elements[i].style.visibility="";
  }
}
//  创建一个半透明的遮罩层
function createBlurDiv(){
var objScreen = document.createElement("div");
var oS = objScreen.style;
 objScreen.id = "ScreenOver";
 oS.display = "block";
 oS.top = oS.left = oS.margin = oS.padding = "0px";
 if (document.body.clientHeight)
 {
  var wh = document.body.clientHeight + "px";
 }else if (window.innerHeight){
   var wh = window.innerHeight + "px";
  }else{
   var wh = "100%";
  }
oS.width = "100%";
oS.height = wh;
oS.position = "absolute";
oS.zIndex = "3";
oS.background = "#cccccc";
oS.filter = "alpha(opacity=40)";
oS.opacity = 40/100;
oS.MozOpacity = 40/100;
document.body.appendChild(objScreen);
selecthidden();
}

//移除遮罩层
function removeBlurDiv(){
 var ScreenOver = document.getElementById("ScreenOver");
 document.body.removeChild(ScreenOver);
 selectshow();
}

// 在遮罩层上面出现一个div层
function divBlock(divname){
 var oneDiv = document.getElementById(divname);
  oneDiv.style.display="block"; 
 }
 
// 把指定的层消失掉
function divNone(divname){
 var oneDiv = document.getElementById(divname);
 oneDiv.style.display="none";
 }
// 出现
function  appear(divname){
 createBlurDiv();
 divBlock(divname);
 }
// 消失
function  disappear(divname){
 divNone(divname);
 removeBlurDiv();
 }