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

115 阅读 0 评论 76 点赞

我是靠谱客的博主安静小懒虫，最近开发中收集的这篇文章主要介绍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> 