半成品：可继续扩展改进的弹出层对话框 -- DIV窗口

闲话不说，直接代码了。兼容IE8、火狐、谷歌。

//1、打开窗口
        function showDialog(url)
        {
            var width = 400;
            var height = 300;
            
            var dsh = document.documentElement.scrollHeight;
            var dch = document.documentElement.clientHeight;
            var dsw = document.documentElement.scrollWidth;
            var dcw = document.documentElement.clientWidth;

            var bdh = (dsh > dch) ? dsh : dch;
            var bdw = (dsw > dcw) ? dsw : dcw;
            
            //--------------------------------------------------------------------------------遮罩层
            var maskDiv = document.createElement("div");
            maskDiv.setAttribute("id","maskDiv");
            maskDiv.style.left = "0px";
            maskDiv.style.top = "0px";
            maskDiv.style.width = "100%";
            maskDiv.style.height = "100%";
            maskDiv.style.position = "absolute";
            maskDiv.style.zIndex = "1000";
            maskDiv.style.backgroundColor = "#000000";
            maskDiv.style.opacity = "0.5";
            maskDiv.style.filter = "alpha(opacity=50)";
            document.body.appendChild(maskDiv);
            
            //--------------------------------------------------------------------------------窗口主容器
            var dialogContainer = document.createElement("div");
            dialogContainer.setAttribute("id","dialogContainer");
            //maskDiv.appendChild(dialogContainer);            
            document.body.appendChild(dialogContainer);
            
            var container = document.getElementById("dialogContainer");            
            container.style.zIndex = "2001";
            container.style.left = (bdw - width) / 2 + "px";
            container.style.top = (bdh - height) / 2 + "px";
            container.style.width = width + "px";
            container.style.height = height + "px";
            container.style.position = "absolute";
            container.style.backgroundColor = "#F0EEEE";
            container.style.border = "1px";
            container.style.borderStyle = "solid";
            container.style.borderColor = "#696969";
            container.style.overflow = "hidden";
            
            //--------------------------------------------------------------------------------Header
            var dialogHeadBar = document.createElement("div");
            dialogHeadBar.setAttribute("id","dialogHeadBar");
            dialogContainer.appendChild(dialogHeadBar);
            
            var headBar = document.getElementById("dialogHeadBar");
            headBar.style.width = width - 4 + "px";
            headBar.style.height = "20px";
            headBar.style.padding = "2px";
            headBar.style.fontSize = "11px";
            headBar.style.cursor = "pointer";
            //headBar.onmousedown = startDrag;   //放开既可拖动         
            
            var barTitle = document.createElement("div");
            barTitle.setAttribute("id","barTitle");
            barTitle.innerHTML = "我的标题";
            barTitle.style.cssFloat = "left";
            barTitle.style.styleFloat = "left";     
            dialogHeadBar.appendChild(barTitle);
            
            var closeArea = document.createElement("div");
            closeArea.setAttribute("id","closeArea");
            closeArea.innerHTML = "关闭";
            closeArea.style.cursor = "pointer";
            closeArea.style.cssFloat = "right";
            closeArea.style.styleFloat = "right";
            closeArea.onclick = closeDialog;
            dialogHeadBar.appendChild(closeArea);
            
            //--------------------------------------------------------------------------------Iframe
            var dialogIframe = document.createElement("iframe");
            dialogIframe.setAttribute("id","dialogIframe");
            dialogIframe.setAttribute("frameborder","0", 1);
            dialogContainer.appendChild(dialogIframe);
            
            var dialogSrcIframe = document.getElementById("dialogIframe");//myIframe
            dialogSrcIframe.src = url;
            dialogSrcIframe.height = height - 50 + "px";
            dialogSrcIframe.width = width + "px";       
            dialogSrcIframe.marginHeight = "0px";               //Pixels 上下空出的高度
              dialogSrcIframe.marginWidth = "0px";                //Pixels 左右空出宽度 
              //dialogSrcIframe.frameBorder = "0";                  //是否显示边框（0无边框 1有边框）        
              dialogSrcIframe.scrolling = "yes";                  //[ yes | no | auto ] 流动条(yes强制显示|no永不显示|auto自动)
            dialogSrcIframe.allowtransparency  = "yes";         //背景是否透明（yes透明 no不透明）

            //--------------------------------------------------------------------------------Footer
            var dialogFootBar = document.createElement("div");
            dialogFootBar.setAttribute("id","dialogFootBar");
            dialogContainer.appendChild(dialogFootBar);
            
            var footBar = document.getElementById("dialogFootBar");
            footBar.style.width = width + "px";
            footBar.style.height = "30px";
            footBar.style.padding = "2px";
            footBar.style.fontSize = "11px";
            
        }
        
        //2、关闭窗口
        function closeDialog()
        {
            var maskDiv = document.getElementById("maskDiv");
            var dialogContainer = document.getElementById("dialogContainer");
            if(maskDiv)
            {
                //dialog.style.display = "none";            
                document.body.removeChild(maskDiv);
                document.body.removeChild(dialogContainer);
            }
        }
        
        //3、拖动窗口
        function startDrag()
        {
            var obj = document.getElementById('dialogContainer');
            rDrag.init(obj);
        }
    
        var rDrag = {
            o:null,
            init:function(o){
                o.onmousedown = this.start;
            },
            start:function(e){
                var o;
                e = rDrag.fixEvent(e);
                e.preventDefault && e.preventDefault();
                rDrag.o = o = this;
                o.x = e.clientX - rDrag.o.offsetLeft;
                o.y = e.clientY - rDrag.o.offsetTop;
                document.onmousemove = rDrag.move;
                document.onmouseup = rDrag.end;
            },
            move:function(e){
                e = rDrag.fixEvent(e);
                var oLeft,oTop;
                oLeft = e.clientX - rDrag.o.x;
                oTop = e.clientY - rDrag.o.y;
                rDrag.o.style.left = oLeft + 'px';
                rDrag.o.style.top = oTop + 'px';
            },
            end:function(e){
                e = rDrag.fixEvent(e);
                rDrag.o = document.onmousemove = document.onmouseup = null;
            },
            fixEvent: function(e){
                if (!e) {
                    e = window.event;
                    e.target = e.srcElement;
                    e.layerX = e.offsetX;
                    e.layerY = e.offsetY;
                }
                return e;
            }
        }

希望对您有帮助。O(∩_∩)O~

改进版：半成品：可继续扩展改进的弹出层对话框（2） - DIV窗口