您现在的位置: 万盛学电脑网 >> 程序编程 >> 脚本专题 >> javascript >> 正文

JS弹出层的显示与隐藏示例代码

作者:佚名    责任编辑:admin    更新时间:2022-06-22

 关于JS弹出层的显示与隐藏,在网上可以搜到很多的类似教程,本文实现了一下,喜欢的朋友不要错过

代码如下: <!--弹出层的显示与隐藏-->  <script type="text/javascript">  //弹出层的显示  //overlays:为遮罩层的ID  //wins:弹出层窗体的ID  //弹出层中用于拖动的ID  function popDIV_show(overlays,wins,wins_title) {  var oLays = documentgetElementById(overlays);  var oWins = documentgetElementById(wins);  var oWins_title = documentgetElementById(wins_title);  var bDrag = false;  var disX = disY = 0;  var w = "";  var n = 1;  if (n > 0) {  oLaysstyledisplay = "block";  oWinsstyledisplay = "block";  oWins_titleonmousedown = function(event) {  var event = event || windowevent;  bDrag = true;  disX = eventclientX - oWinsoffsetLeft;  disY = eventclientY - oWinsoffsetTop;  thissetCapture && thissetCapture();  return false  };  documentonmousemove = function(event) {  if (!bDrag)  return;  var event = event || windowevent;  var iL = eventclientX - disX;  var iT = eventclientY - disY;  var maxL = documentdocumentElementclientWidth  - oWinsoffsetWidth;  var maxT = documentdocumentElementclientHeight  - oWinsoffsetHeight;  iL = iL < 0 ? 0 : iL;  iL = iL > maxL ? maxL : iL;  iT = iT < 0 ? 0 : iT;  iT = iT > maxT ? maxT : iT;  oWinsstylemarginTop = oWinsstylemarginLeft = 0;  oWinsstyleleft = iL + "px";  oWinsstyletop = iT + "px";  return false;  };  documentonmouseup = windowonblur = oWins_titleonlosecapture = function() {  bDrag = false;  oWins_titlereleaseCapture && oWins_titlereleaseCapture();  };  }  }  //弹出层的隐藏  //overlays:为遮罩层的ID  //wins:弹出层窗体的ID  function popDIV_hidden(overlays,wins) {  var oWins = documentgetElementById(wins);  var oLays = documentgetElementById(overlays);  oWinsstyledisplay = "none";  oLaysstyledisplay = "none";  }  </script>