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 相关文章推荐
EXT窗口Window及对话框MessageBox
Jan 27 Javascript
JQuery中判断一个元素下面是否有内容或者有某个标签的判断代码
Feb 02 Javascript
JQuery实现简单时尚快捷的气泡提示插件
Dec 20 Javascript
重写document.write实现无阻塞加载js广告(补充)
Dec 12 Javascript
jquery仿百度经验滑动切换浏览效果
Apr 14 Javascript
jquery对dom节点的操作【推荐】
Apr 15 Javascript
Vue.js报错Failed to resolve filter问题的解决方法
May 25 Javascript
jQuery实现获取选中复选框的值实例详解
Jun 28 jQuery
vue-resource请求实现http登录拦截或者路由拦截的方法
Jul 11 Javascript
express框架中使用jwt实现验证的方法
Aug 25 Javascript
小程序点击图片实现png转jpg
Oct 22 Javascript
Vue.js实现大屏数字滚动翻转效果
Nov 29 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
超人钢铁侠联手合作?美漫作家呼吁DC漫威合作联动以抵抗疫情
2020/04/09 欧美动漫
PHP 开发环境配置(Zend Server安装)
2010/04/28 PHP
将一维或多维的数组连接成一个字符串的php代码
2010/08/08 PHP
CentOS下与Apache连接的PHP多版本共存方案实现详解
2015/12/19 PHP
php中的异常和错误浅析
2017/05/03 PHP
基于Jquery的跨域传输数据(JSONP)
2011/03/10 Javascript
wap浏览自动跳转到wap页面的js代码
2014/05/17 Javascript
JQuery的Ajax中Post方法传递中文出现乱码的解决方法
2014/10/21 Javascript
jquery超简单实现手风琴效果的方法
2015/06/05 Javascript
AngularJs 60分钟入门基础教程
2016/04/03 Javascript
hammer.js实现图片手势放大效果
2017/08/29 Javascript
vue.js实例对象+组件树的详细介绍
2017/10/20 Javascript
JS+CSS实现网页加载中的动画效果
2017/10/27 Javascript
3分钟了解vue数据劫持的原理实现
2019/05/01 Javascript
Vue编程式跳转的实例代码详解
2019/07/10 Javascript
Flutter 超实用简单菜单弹出框 PopupMenuButton功能
2019/08/06 Javascript
[01:09:19]DOTA2-DPC中国联赛 正赛 VG vs Aster BO3 第二场 2月28日
2021/03/11 DOTA
python中的sort方法使用详解
2014/07/25 Python
Python使用cx_Oracle调用Oracle存储过程的方法示例
2017/10/07 Python
python OpenCV学习笔记实现二维直方图
2018/02/08 Python
pandas使用apply多列生成一列数据的实例
2018/11/28 Python
Python画图实现同一结点多个柱状图的示例
2019/07/07 Python
利用Python实现kNN算法的代码
2019/08/16 Python
python实现发送邮件
2021/03/02 Python
浅谈关于html5中图片抛物线运动的一些心得
2018/01/09 HTML / CSS
浅谈移动端网页图片预加载方案
2018/11/05 HTML / CSS
Blue Nile蓝色尼罗河香港官网:世界最大在线钻石珠宝销售商
2020/05/07 全球购物
局部内部类是否可以访问非final变量?
2013/04/20 面试题
党员志愿者活动总结
2014/06/26 职场文书
2014年依法行政工作总结
2014/11/19 职场文书
研究生给导师的自荐信
2015/03/06 职场文书
毕业设计致谢语
2015/05/14 职场文书
2015年城市管理工作总结
2015/05/23 职场文书
2015年依法治校工作总结
2015/07/27 职场文书
python基础之类属性和实例属性
2021/10/24 Python
Flutter Navigator 实现路由传递参数
2022/04/22 Java/Android