当前位置: 首页 > 图文教程 > 网络编程 > Javascript > jquery 锁定弹出层实现代码

Javascript
jQuery chili图片远处放大插件
Aptana调试javascript图解教程
JS 动态获取节点代码innerHTML分析 [IE,FF]
jquery 分页控件实现代码
Ruffy javascript 学习笔记
JavaScript 学习笔记 Black.Caffeine 09.11.28
Jquery 快速构建可拖曳的购物车DragDrop
js 变量类型转换常用函数与代码[比较全]
JavaScript 直接操作本地文件的实现代码
兼容IE与Firefox的js 复制代码
让FireFox支持innerText的实现代码
js 表格隔行颜色
Jquery选择器 $实现原理
JS类的封装及实现代码
用Javascript检查Adobe PDF插件是否安装的实现代码
鼠标拖动动态改变表格的宽度的js脚本 兼容ie/firefox
JavaScript Object的extend是一个常用的功能
JavaScript 报表展示实现代码
两种WEB下的模态对话框 (asp.net或js的分别实现)
checkbox全选/取消全选以及checkbox遍历jQuery实现代码

Javascript 中的 jquery 锁定弹出层实现代码


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2010-02-27   浏览: 276 ::
收藏到网摘: n/a

经常遇到要弹出一个悬浮层,鼠标的事件只能在本层上有效,底层会失效。能用的做 法是在悬浮层和底层之间在加一个遮盖层,遮盖住整个浏览器,这样就不能点击底层的任何东西了。 遮盖层的定义:
复制代码 代码如下:

var w = Math.max(document.documentElement.scrollWidth, document.documentElement.clientWidth) + "px"; //获取宽
var h = Math.max(document.documentElement.scrollHeight, document.documentElement.clientHeight) + "px"; //获取高
//定义一个透明背景层
var gb = $("<div/>").attr("id","gb")
.css({top:"0",left:"0",zIndex:"2",position:"absolute",filter:"alpha(opacity=0)",background:"#fff"})
.css("width",w).css("height",h)

其实说明最主要还是说明一下背景层的CSS定义。首先要使top和left有效,就要设置 position:absolute。filter:"alpha(opacity=0)设置透明度,数值0-100,0表示完全透明,100表示不透明。background设置背景层的颜色。zIndex的值只要比底层的高,比弹出层的低就行了。(zIndex的值越大表示越在上层)。好了,基本就是这样吧!