JS弹出对话层方法实现

来源：互联网发布：中国人口和房价知乎编辑：程序博客网时间：2024/04/29 19:01

<html>
<head>
<script language="javascript" type="text/javascript">
function esclubAlert(str){
var bgdiv,msgdiv;
var opacity = "0.75";
var bgWidth,bgHeight;
var msgWidth,msgHeight;
msgWidth = 500;
msgHeight = 200;
if (typeof (window.innerWidth) == "number") {
      bgWidth = window.innerWidth;
      bgHeight = window.innerHeight;
} else {
      if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
          bgWidth = document.documentElement.clientWidth;
          bgHeight = document.documentElement.clientHeight;
      } else {
          if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
              bgWidth = document.body.clientWidth;
              bgHeight = document.body.clientHeight;
          }
      }
}
bgdiv = document.createElement("div");
bgdiv.setAttribute("id","bgdiv");
bgdiv.style.position = "absolute";
bgdiv.style.top = 0;
bgdiv.style.left = 0;
bgdiv.style.background = "#cccccc";
bgdiv.style.filter = "FILTER:alpha(opacity=75)";
bgdiv.style.opacity = "0.75";
bgdiv.style.width = bgWidth+"px";
bgdiv.style.height = bgHeight + "px";
bgdiv.style.zIndex = "9999";
document.body.appendChild(bgdiv);
bgdiv.style.display = "none";

msgdiv = document.createElement("div");
msgdiv.setAttribute("id","msgdiv");
msgdiv.setAttribute("align","center");
msgdiv.innerHTML = str;
msgdiv.style.Height = msgHeight + "px";
msgdiv.style.width = msgWidth + "px";
msgdiv.style.background = "white";
msgdiv.style.zIndex = "10001";
msgdiv.style.position = "absolute";
msgdiv.style.textAlign = "center";
document.body.appendChild(msgdiv);
msgWidth = msgdiv.clientWidth;
msgHeight = msgdiv.clientHeight;
msgdiv.style.left = (bgWidth-msgWidth)/2;
msgdiv.style.top = (bgHeight-msgHeight)/2;
msgdiv.style.display = "none";

this.reload = function(){
   if (typeof (window.innerWidth) == "number") {
        bgWidth = window.innerWidth;
        bgHeight = window.innerHeight;
    } else {
        if (document.documentElement && (document.documentElement.clientWidth || document.documentElement.clientHeight)) {
            bgWidth = document.documentElement.clientWidth;
            bgHeight = document.documentElement.clientHeight;
        } else {
            if (document.body && (document.body.clientWidth || document.body.clientHeight)) {
                bgWidth = document.body.clientWidth;
                bgHeight = document.body.clientHeight;
            }
        }
    }
    bgdiv.style.width = bgWidth+"px";
   bgdiv.style.height = bgHeight + "px";
   var msgdis = msgdiv.style.display;
   if(msgdis == "none"){
    msgdiv.style.display = "";
   }
   msgWidth = msgdiv.clientWidth;
   msgHeight = msgdiv.clientHeight;
   msgdiv.style.left = (bgWidth-msgWidth)/2;
   msgdiv.style.top = (bgHeight-msgHeight)/2;
   msgdiv.style.display = msgdis;
};
this.show = function(){
  bgdiv.style.display="";
  msgdiv.style.display="";
};

this.close = function(){
  bgdiv.style.display = "none";
   msgdiv.style.display = "none";
};
this.show();
}
</script>
</head>
<body>
<script>
  var a = new esclubAlert("<img src='loading.gif' border='0'/>loading...");
</script>
</body>
</html>