JS彈出層的顯示與隱藏示例代碼
更新時間:2013年12月27日 11:39:52 作者:
關于JS彈出層的顯示與隱藏,在網(wǎng)上可以搜到很多的類似教程,本文實現(xiàn)了一下,喜歡的朋友不要錯過
復制代碼 代碼如下:
<!--彈出層的顯示與隱藏-->
<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>
相關文章
Bootstrap 模態(tài)框(Modal)插件代碼解析
Bootstrap 模態(tài)框(Modal)插件 模態(tài)框(Modal)是覆蓋在父窗體上的子窗體。這篇文章主要介紹了Bootstrap 模態(tài)框(Modal)插件代碼解析的相關資料,需要的朋友可以參考下2016-12-12JavaScript將Web頁面內容導出到Word及Excel的方法
這篇文章主要介紹了JavaScript將Web頁面內容導出到Word及Excel的方法,涉及javascript操作ActiveXObject控件的使用技巧,具有一定參考借鑒價值,需要的朋友可以參考下2015-02-02javascript中對象的定義、使用以及對象和原型鏈操作小結
這篇文章主要介紹了javascript中對象的定義、使用以及對象和原型鏈操作,結合實例形式總結分析了javascript對象操作的常用技巧,需要的朋友可以參考下2016-12-12