js 遮罩层

js代码

 

<script language="javascript">
function Open()
{
   //隐藏select控件
   DispalySelect(0); 
   //显示遮罩层
   document.getElementById("divPageMask").style.display="block";
//处理遮罩层
   resizeMask();
window.onResize = resizeMask;
   //显示弹出窗口
   document.getElementById("divOpenWin").style.display="block";
}
function Close()
{
   //显示select控件
   DispalySelect(1);
   //处理遮罩层
   divPageMask.style.width = "0px";
divPageMask.style.height = "0px";
divOpenWin.style.display = "none";
window.onResize = null;
 
   document.getElementById("divOpenWin").style.display="none";
}
//页面遮罩
function resizeMask()
{
divPageMask.style.width = document.body.scrollWidth;
divPageMask.style.height = document.body.scrollHeight;
divOpenWin.style.left = ((document.body.offsetWidth - divOpenWin.offsetWidth) / 2);
//divOpenWin.style.top = ((document.body.offsetHeight - divOpenWin.offsetHeight) / 2);
}
function DispalySelect(val)
{   //显示和隐藏select控件
var dispalyType;
   var arrdispalyType=["hidden","visible"];
   var arrObjSelect=document.getElementsByTagName("select");
   for (i=0;i<arrObjSelect.length;i++)
   {
     arrObjSelect[i].style.visibility=arrdispalyType[val];
   }
}

 

            window.onload = function() {

                 Open();

                
            }

 

html 代码

 

        <div id="divPageMask"></div>
        <div id="divOpenWin">

css 代码

 

    <style type="text/css">
    .body,td{font-size:12px}
    #divPageMask{background-color:#333; filter:alpha(opacity=50);left:0px;position:absolute;top:0px;}
    #divOpenWin{border:1px solid #000;position:absolute;width:400px;height:300px;background-color:#fff; color:#333;padding:6px 6px}
    </style>