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 相关文章推荐
js异或加解密效果代码
Jun 25 Javascript
javascript 动态添加事件代码
Nov 30 Javascript
jquery ajax post提交数据乱码
Nov 05 Javascript
js复制网页内容并兼容各主流浏览器的代码
Dec 17 Javascript
jQuery基于ID调用指定iframe页面内的方法
Jul 06 Javascript
JS实现表单多文件上传样式美化支持选中文件后删除相关项
Sep 30 Javascript
详解jQuery的表单验证插件--Validation
Dec 21 Javascript
Vue实例中生命周期created和mounted的区别详解
Aug 25 Javascript
webpack打包js文件及部署的实现方法
Dec 18 Javascript
Vue中使用的EventBus有生命周期
Jul 12 Javascript
对layui中table组件工具栏的使用详解
Sep 19 Javascript
JavaScript使用localStorage存储数据
Sep 25 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
重料打造自己的“宝马”---第三代
2021/03/02 无线电
ThinkPHP3.1数据CURD操作快速入门
2014/06/19 PHP
php微信公众平台示例代码分析(二)
2016/12/06 PHP
php使用环形链表解决约瑟夫问题完整示例
2018/08/07 PHP
javascript结合html5 canvas实现(可调画笔颜色/粗细/橡皮)的涂鸦板
2013/04/27 Javascript
javascript实现的DES加密示例
2013/10/30 Javascript
Asp.Net alert弹出提示信息的几种方法总结
2014/01/29 Javascript
一个支付页面DEMO附截图
2014/07/22 Javascript
js实现点击添加一个input节点
2014/12/05 Javascript
javascript中return,return true,return false三者的用法及区别
2015/11/17 Javascript
js 获取本地文件及目录的方法(推荐)
2016/11/10 Javascript
详解vue-cli + webpack 多页面实例配置优化方法
2017/07/13 Javascript
浅析JavaScript中的特殊数据类型
2017/12/15 Javascript
jQuery实现的响应鼠标移动方向插件用法示例【附源码下载】
2018/08/28 jQuery
[02:29]DOTA2英雄基础教程 陈
2013/12/17 DOTA
[01:23:24]DOTA2-DPC中国联赛 正赛 PSG.LGD vs Elephant BO3 第三场 2月7日
2021/03/11 DOTA
Python实现端口复用实例代码
2014/07/03 Python
简述Python中的面向对象编程的概念
2015/04/27 Python
python实现批量图片格式转换
2020/06/16 Python
python中import与from方法总结(推荐)
2019/03/21 Python
查看python安装路径及pip安装的包列表及路径
2019/04/03 Python
解析python的局部变量和全局变量
2019/08/15 Python
Python 如何操作 SQLite 数据库
2020/08/17 Python
6PM官网:折扣鞋、服装及配饰
2018/08/03 全球购物
英国豪华家具和家居用品购物网站:Teddy Beau
2020/10/12 全球购物
采购部岗位职责
2013/11/24 职场文书
公证书标准格式
2014/04/10 职场文书
歌唱比赛策划方案
2014/06/06 职场文书
建国大业电影观后感
2015/06/01 职场文书
公司出差管理制度范本
2015/08/05 职场文书
践行三严三实心得体会(2016推荐篇)
2016/01/06 职场文书
小学科学课教学反思
2016/02/23 职场文书
2019年冬至:天冷暖人心的问候祝福语大全
2019/12/20 职场文书
如何在CocosCreator里画个炫酷的雷达图
2021/04/16 Javascript
Python如何解决secure_filename对中文不支持问题
2021/07/16 Python
SpringBoot 整合mongoDB并自定义连接池的示例代码
2022/02/28 MongoDB