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


Posted in Javascript onDecember 27, 2013
<!--弹出层的显示与隐藏--> 
<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>
Javascript 相关文章推荐
编写自己的jQuery插件简单实现代码
Apr 19 Javascript
document.createElement()用法及注意事项(ff下不兼容)
Mar 13 Javascript
jquery1.9 下检测浏览器类型和版本的方法
Dec 26 Javascript
JavaScript实现向setTimeout执行代码传递参数的方法
Apr 16 Javascript
详解Bootstrap glyphicons字体图标
Jan 04 Javascript
几句话带你理解JS中的this、闭包、原型链
Sep 26 Javascript
JS 调试中常见的报错问题解决方法
May 20 Javascript
jquery中done和then的区别(详解)
Dec 19 jQuery
jQuery实现的简单对话框拖动功能示例
Jun 05 jQuery
vue 修改 data 数据问题并实时显示的方法
Aug 27 Javascript
微信小程序swiper禁止用户手动滑动代码实例
Aug 23 Javascript
JS数组的常用方法整理
Mar 31 Javascript
javascript实现的弹出层背景置灰-模拟(easyui dialog)
Dec 27 #Javascript
jQuery删除节点的三个方法即remove()detach()和empty()
Dec 27 #Javascript
类似php的js数组的in_array函数自定义方法
Dec 27 #Javascript
JavaScript将页面表格导出为Excel的具体实现
Dec 27 #Javascript
Java/JS获取flash高宽的具体方法
Dec 27 #Javascript
location.href用法总结(最主要的)
Dec 27 #Javascript
Javascript四舍五入Math.round()与Math.pow()使用介绍
Dec 27 #Javascript
You might like
PHP实现MVC开发得最简单的方法――模型
2007/04/10 PHP
Zend Studio 无法启动的问题解决方法
2008/12/04 PHP
如何解决CI框架的Disallowed Key Characters错误提示
2013/07/05 PHP
php使用smtp发送支持附件的邮件示例
2014/04/13 PHP
PHP定时更新程序设计思路分享
2014/06/10 PHP
使用jQuery制作遮罩层弹出效果的极简实例分享
2016/05/12 Javascript
AngularJS中实现动画效果的方法
2016/07/28 Javascript
jQuery的deferred对象使用详解
2016/09/25 Javascript
Bootstrap源码解读排版(1)
2016/12/23 Javascript
详解各版本React路由的跳转的方法
2018/05/10 Javascript
对layui中的onevent 和event的使用详解
2019/09/06 Javascript
python测试驱动开发实例
2014/10/08 Python
python实现无证书加密解密实例
2014/10/27 Python
Python使用turtule画五角星的方法
2015/07/09 Python
Python3字符串学习教程
2015/08/20 Python
关于Python数据结构中字典的心得
2017/12/04 Python
python处理csv数据动态显示曲线实例代码
2018/01/23 Python
在dataframe两列日期相减并且得到具体的月数实例
2018/07/03 Python
Python中的Numpy矩阵操作
2018/08/12 Python
详解Python的数据库操作(pymysql)
2019/04/04 Python
详解anaconda离线安装pytorchGPU版
2020/09/08 Python
详解HTML5新增标签
2017/11/27 HTML / CSS
迪卡侬荷兰官网:Decathlon荷兰
2017/10/29 全球购物
如何使用PHP session
2015/04/21 面试题
信息管理专业学生自荐信格式
2013/09/22 职场文书
如何进行有效的自我评价
2013/09/27 职场文书
自荐信范文
2013/12/10 职场文书
聊城大学毕业生自荐书
2014/02/01 职场文书
师德师风自查材料
2014/10/14 职场文书
基层党员学习党的群众路线教育实践活动心得体会
2014/11/04 职场文书
2016大一新生军训感言
2015/12/08 职场文书
财务会计个人原因辞职信
2019/06/21 职场文书
pytorch 6 batch_train 批训练操作
2021/05/28 Python
源码解读Spring-Integration执行过程
2021/06/11 Java/Android
pycharm部署django项目到云服务器的详细流程
2021/06/29 Python
mysql连接查询中and与where的区别浅析
2021/07/01 MySQL