JS遮罩层(屏蔽下拉框，随滚动条移动).doc

如何实现遮罩层？ 在IE，层DIV被下拉框SELECT遮盖，这是IE的bug之一，原因在于select的优先级别比div高。因此无论如何用css属性z-index设置都没用。 所以，解决的办法有两种 在显示div的时候隐藏所有select 让div里的内容比select的优先级还要高 第一种方法显然比较麻烦，特别是当select比较多且位置不固定的时候，很容易将不该隐藏的也隐藏了。 第二钟办法更好一些。常用的优先级比select高的HTML控件有object和iframe，我选用了iframe比较好。//定义遮罩层 var oDivFilter = null;//用于承载IFRAME var oIframe = null;//IFRAME用于遮盖下拉框 var DivContent = null;//显示内容层 //主函数 参数分别表示遮罩层的大小 function FilterDIV(width,height) { if(!width (!oDivFilter ||(oDivFilter oDivFilter.style.display==none))) return; //遮罩层在刷新前只创建一次，减少系统开支 if(!oDivFilter) {//如果不存在 那么创建 //创建IFRAME oIframe = document.createElement(iframe id=\oIframeFilter\ name=\oIframeFilter\ frameborder=\0\ /iframe); //创建IFRAME的承载容器 oDivFilter = document.createElement(div id=\oDivFilter\ style=\display:none;\ name=\oDivFilter\/div); //创建内容显示容器 DivContent = document.createElement(div id=\DivContent\ style=\display:none;\ name=\DivContent\/div); //将以上容器加入页面 oDivFilter.appendChild(oIframe); document.body.appendChild(oDivFilter); document.body.appendChild(DivContent); //增加关闭按钮 inputClose = document.createElement(input type=button onclick=Div_Close(); value=关闭/); DivContent.appendChild(inputClose); } //如果是打开事件调用 那么直接从参数获取大小 否则以创建的容器获取 var tempW = 0; var tempH = 0; if(!width) { tempW = oDivFilter.style.width.indexOf(px) -1 ? oDivFilter.style.width.substr(0,oDivFilter.style.width.length-2) :oDivFilter.style.width; tempH = oDivFilter.style.height.indexOf(px) -1 ? oDivFilter.style.height.substr(0,oDivFilter.style.height.length-2) :oDivFilter.style.height; } else { tempW = width; tempH = height; } //计算遮罩层显示位置 var left = (document.documentElement.clientWidth - tempW) / 2; var top = (document.documentEl