[js]用javascript实现的带蒙版弹出窗口

现在越来越多的网站都用这种形式的弹出窗口进行登录操作，例如迅雷和百度。

但不仅仅是登录，有些页面的打开操作用这种弹窗也是很方便的。

Code
function $(elem){
             return document.getElementById(elem);
         }
         
         function Win_pop(isbackDiv,srcPop){
          if($('floatDiv')==null){
           var floatDiv = document.createElement('div');
           floatDiv.id = "floatDiv"; 
           floatDiv.style.position = "absolute";
           floatDiv.style.width = 500 + "px";
           floatDiv.style.height = 400 + "px";
           floatDiv.style.left =(document.documentElement.clientWidth/2 + document.documentElement.scrollLeft - 250)+"px";
           floatDiv.style.top =(document.documentElement.clientHeight/2 + document.documentElement.scrollTop - 200)+"px";
           floatDiv.style.zIndex  = 1001;
           var loginText = "<iframe id=\"iframe1\" frameborder=\"0\" scrolling=\"no\" src='" + srcPop + "' width='100%' height='200'></iframe>";
           floatDiv.innerHTML = loginText;
           document.body.appendChild(floatDiv);
          }
          else{
           $('floatDiv').style.display = "block";
          }
          if($('backDiv')==null && isbackDiv ==true){
           var backDiv = document.createElement('div');
           backDiv.id = "backDiv";
           backDiv.style.backgroundColor = "Black";
           backDiv.style.filter = "alpha(opacity=50)";
           backDiv.style.MozOpacity = "0.50";
           backDiv.style.position = "absolute";
           backDiv.style.left = "0px";
           backDiv.style.top = "0px";
           backDiv.style.width = Math.max(document.body.scrollWidth, document.documentElement.clientWidth) +"px";
           backDiv.style.height = Math.max(document.body.scrollHeight, document.documentElement.clientHeight)+"px";
           document.body.appendChild(backDiv);
           $('backDiv').style.zIndex = 100;
          }
          else if(isbackDiv ==true){
           $('backDiv').style.display = "block";
          }  
         }
         
         function CloseFloatDiv(){              //关闭窗口
          $('floatDiv').style.display = "none";
          ($('floatDiv')).parentNode.removeChild($('floatDiv'));        //删除该div标签
          if($('backDiv')){
           $('backDiv').style.display = "none";
          }
         }

注意$('floatDiv')).parentNode.removeChild($('floatDiv')); 这一句代码，当此JS不用来当登录窗口用时，也就是在一个页面上多次使用了该js，那么这句代码就很有必要了，否则js程序会跳过创建对应页面的iframe，直接引用了第一次所创建的iframe。

 

转载于:https://www.cnblogs.com/lolicon/archive/2008/12/21/1359356.html