<style>.mask {    width:100%;    height:100%;    position: absolute;    top:0;    left:0;    filter: alpha(opacity=40);    -moz-opacity:0.4;    opacity:0.4;    background-color: #ffffff;    z-index:2;    display: none;}div.sample_popup {    height:auto;    border:10px solid #646464;    width:300px;}div.menu_form_header {    background:#333333;}div.sample_popup div.menu_form_header {    border-bottom: 0px;    cursor: default;    width:100%;    height:40px;    line-height: 40px;    text-align:center;    text-decoration: none;    font-family: "Times New Roman", Serif;    font-weight:bold;    font-size:14px;    color:#fff;}div.menu_form_body {    width:100%;    height:80px;    font-size:12px;    line-height:80px;    text-align:center;    background:#fff;    color:#333;}div.sample_popup input.menu_form_exit {    float: right;    margin: 4px 5px 0px 0px;    cursor: pointer;}div.sample_popup .button {    width:50px;    height:19px;    border:0;    background:#fff;    cursor:pointer;    color:#333;}div.sample_popup a {    color:#333;    display:inline-block;    width:50px;    height:19px; *line-height:17px;}</style>

<script type="text/javascript">    var DivWindow= function(    popup//最外层div id*/    ,popup_drag//拖动div id*/    ,popup_ok//确定按钮id*/    ,okButton//触发服务器端确定按钮id*    ,popup_exit//退出按钮id*/    ,exitButton//触发服务器端退出按钮id*/    ,varwidth,varheight,zindex){            this.popup =popup ; //窗口名称            this.popup_drag=popup_drag;            this.height =varheight ; //窗口高度，并没用来设置窗口高度宽度，用来定位在屏幕的位置            this.width =varwidth ; //窗口宽度            this.popup_ok=popup_ok;            this.okButton=okButton;            this.popup_exit=popup_exit;            this.exitButton=exitButton;            this.zindex=zindex;            this.init = function(){ //初始化窗口               this.popupShow();               this.startDrag(); //设置拖动               this.setCommondOk();                this.setCommondExit();//设置关闭                  DivWindow.ArrayW.push(document.getElementById(this.popup)); //存储窗口到数组            };        this.init();    };            //存储窗口到数组           DivWindow.ArrayW = new Array();           //字符串连接类           DivWindow.StringBuild = function(){        this.arr = new Array();        this.push = function(str){           this.arr.push(str);         };        this.toString = function(){         return this.arr.join("");        };    };    //拖动类     DivWindow.Drag = function(o ,oRoot){         var _self = this;       //拖动对象       this.obj = (typeof oRoot != "undefined") ?oRoot : o;       this.relLeft = 0; //记录横坐标       this.relTop = 0; //记录纵坐标       o.onselectstart = function(){         return false;       };       o.onmousedown = function(e){ //鼠标按下         e = _self.fixE(e);       _self.relLeft = e.clientX - _self.fixU(_self.obj.style.left);       _self.relTop = e.clientY - _self.fixU(_self.obj.style.top);      document.onmousemove = function(e){         _self.drag(e);         };      document.onmouseup  = function(){       _self.end();        };     };     this.drag = function(e){ //拖动      e = this.fixE(e);      var l = e.clientX - this.relLeft;      var t = e.clientY - this.relTop;      if (t < 0)      {       t = 0; //防止头部消失      }      this.obj.style.left = l +"px";      this.obj.style.top = t +"px";     };     this.end = function(){ //结束拖动      document.onmousemove = null;      document.onmouseup = null;     };     this.fixE = function(e){ //修复事件      if (typeof e == "undefined") e = window.event;      return e;     };     this.fixU = function(u){ //处理px单位      return parseInt(u.split("p")[0]);     };    };    //窗口拖动    DivWindow.prototype.startDrag = function(){     var obj = document.getElementById(this.popup);            var drag = document.getElementById(this.popup_drag);     new DivWindow.Drag(drag,obj);    };    //设定窗口优先级    DivWindow.prototype.setTop = function(){     document.getElementById(this.popup).onclick =     document.getElementById(this.popup).onmousedown =     function(){      for(var i=0;i<DivWindow.ArrayW.length;i++)      {       DivWindow.ArrayW[i].style.zIndex = 1;      }      this.style.zIndex = 100;     };    };    //显示    DivWindow.prototype.popupShow=function()    {               document.getElementById(‘mask‘).style.display = "block";        document.getElementById(‘mask‘).style.width=window.screen.width +20;        document.getElementById(‘mask‘).style.height=window.screen.width +20;        var element = document.getElementById(this.popup);        element.style.position = "absolute";        element.style.visibility = "visible";        element.style.display = "block";        element.style.width=this.width;        element.style.height=‘auto‘;        element.style.left = (window.screen.width - this.width)/2+"px";        element.style.top =(window.screen.height-this.height)/2+"px";        // element.style.top  =20+"px";        element.style.zIndex=this.zindex;    }        //设置关闭    DivWindow.prototype.setCommondExit = function(){     var _self = this;     //根对象     var obj = document.getElementById(this.popup);     var exit = document.getElementById(this.popup_exit);     var triggServerEvent=document.getElementById(this.exitButton);     //设置关闭      exit.onclick = function(){            obj.style.display = "none";            obj.style.visibility = ‘hidden‘;            document.getElementById(‘mask‘).style.display=‘none‘//关闭遮罩层            this.result=false;            triggServerEvent.click();//触发服务器端退出事件       };    };        //设置确定    DivWindow.prototype.setCommondOk = function(){     var _self = this;     //根对象     var obj = document.getElementById(this.popup);     var ok = document.getElementById(this.popup_ok);     var triggServerEvent=document.getElementById(this.okButton);     //设置关闭      ok.onclick = function(){            obj.style.display = "none";            obj.style.visibility = ‘hidden‘;            document.getElementById(‘mask‘).style.display=‘none‘//关闭遮罩层            this.result=true;            triggServerEvent.click();//触发服务器端确定事件       };    };        function okClick()    {        alert("ok");    }    function exitClick()    {        alert("exit");    }</script>

<input type="button" id="show" onclick="javascript:new DivWindow(‘popup‘,‘popup_drag‘,‘popup_ok‘,‘okButton‘,‘popup_exit‘,‘exitButton‘,‘500‘,‘700‘,4);" value=http://www.mamicode.com/‘触发‘ />"mask" class="mask"> </div><!-- 弹出基本资料详细DIV层 --><div class="sample_popup" id="popup" style="visibility: hidden; display: none;">  <div class="menu_form_header" id="popup_drag">    <p>温馨提示</p>  </div>  <div class="menu_form_body" >    <p id="popDetail">确定要执行该操作吗？</p>  </div>  <div style="background:#fff;text-align:center;height:30px;">    <input type="button" id="popup_ok" value="http://www.mamicode.com/[确定]" class="button" />    <input type="hidden" id="okButton" onClick="okClick()" value="http://www.mamicode.com/ok"  />    <input type="button" id="popup_exit" value="http://www.mamicode.com/[退出]" class="button" />    <input type="hidden" id="exitButton" onClick="exitClick()" value="http://www.mamicode.com/exit" />  </div></div>