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 相关文章推荐
Javascript Ajax异步读取RSS文档具体实现
Dec 12 Javascript
JavaScript中的无阻塞加载性能优化方案
Oct 10 Javascript
Vue.js 表单校验插件
Aug 14 Javascript
使用bat打开多个cmd窗口执行gulp、node
Feb 17 Javascript
微信小程序开发之相册选择和拍照详解及实例代码
Feb 22 Javascript
jquery-file-upload 文件上传带进度条效果
Nov 21 jQuery
javascript中关于类型判断的一些疑惑小结
Oct 14 Javascript
vue实现todolist基本功能以及数据存储功能实例详解
Apr 11 Javascript
Vue中点击active并第一个默认选中功能的实现
Feb 24 Javascript
vue中template的三种写法示例
Oct 21 Javascript
JS实现购物车基本功能
Nov 08 Javascript
vue项目中的支付功能实现(微信支付和支付宝支付)
Feb 18 Vue.js
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购物车实现代码
2011/10/10 PHP
php _autoload自动加载类与机制分析
2012/02/10 PHP
PHP内存缓存Memcached类实例
2014/12/08 PHP
PHP记录页面停留时间的方法
2016/03/30 PHP
php文件上传及下载附带显示文件及目录功能
2017/04/27 PHP
php curl上传、下载、https登陆实现代码
2017/07/23 PHP
php的无刷新操作实现方法分析
2020/02/28 PHP
12个非常有创意的JavaScript小游戏
2010/03/18 Javascript
javascript对象之内置对象Math使用方法
2010/04/16 Javascript
javascript调试说明
2010/06/07 Javascript
javascript实时显示北京时间的方法
2015/03/12 Javascript
JS通过ajax动态读取xml文件内容的方法
2015/03/24 Javascript
简介JavaScript中toUpperCase()方法的使用
2015/06/06 Javascript
js实现页面跳转的五种方法推荐
2016/03/10 Javascript
使用jQuery UI库开发Web界面的简单入门指引
2016/04/22 Javascript
BootStrap使用file-input插件上传图片的方法
2016/09/05 Javascript
js监听input输入框值的实时变化实例
2017/01/26 Javascript
Javascript实现信息滚动效果
2017/05/18 Javascript
JS实现按钮控制计时开始和停止功能
2017/07/27 Javascript
原生JS实现动态加载js文件并在加载成功后执行回调函数的方法
2020/12/30 Javascript
Flutter部件内部状态管理小结之实现Vue的v-model功能
2019/06/11 Javascript
基于JavaScript伪随机正态分布代码实例
2019/11/07 Javascript
Python脚本实现虾米网签到功能
2016/04/12 Python
Python过滤列表用法实例分析
2016/04/29 Python
python添加模块搜索路径方法
2017/09/11 Python
面向对象学习之pygame坦克大战
2019/09/11 Python
浅谈Pytorch torch.optim优化器个性化的使用
2020/02/20 Python
解决使用python print打印函数返回值多一个None的问题
2020/04/09 Python
Html5实现用户注册自动校验功能实例代码
2016/05/24 HTML / CSS
ECCO爱步官方旗舰店:丹麦鞋履品牌
2018/01/02 全球购物
怎样写好自荐信和推荐信
2013/12/26 职场文书
精彩的演讲稿开头
2014/05/08 职场文书
伏羲庙导游词
2015/02/09 职场文书
业务内勤岗位职责
2015/04/13 职场文书
涨工资申请书应该怎么写?
2019/07/08 职场文书
mysql 8.0.27 绿色解压版安装教程及配置方法
2022/04/20 MySQL