假设我们有一个容器container如下: 复制代码 代码如下: <BR>#container{width:auto;height:auto; overflow:hidden;} <BR>/*这里的overflow:hidden;属性主要是为了设置使超出container的部分自动隐藏，之所以设置这个属性，是为了解决ie8及以下版本浏览器兼容性问题*/ <BR> 现在要在网页中弹出一个div层，使在关闭弹出的div层之前不可操作container。 那么，我们首先需要定义出这个遮罩的div层如下: 复制代码 代码如下: 接下来，就是用js来使遮罩层始终显示在屏幕上并不可操作遮罩层下面的内容，点击关闭按钮关闭遮罩层 复制代码 代码如下: <BR>$(function(){ <BR>//获取当前浏览器的内部宽和高 <BR>varnWidth = window.innerWidth; <BR>varnHeight = window.innerHeight; <BR>//设置遮罩层的宽和高 <BR>$("#shade").width(nWidth); <BR>$("#shade").height(nHeight); <BR>//设置关闭按钮居中显示 <BR>$("#close").css("margin-top",nHeight/2-50+"px"); <BR>//设置当浏览器大小改变时触发的事件 <BR>$(window).resize(function(){ <BR>//获取当前浏览器的内部宽和高 <BR>varnWidth = window.innerWidth; <BR>varnHeight = window.innerHeight; <BR>//设置遮罩层的宽和高 <BR>$("#shade").width(nWidth); <BR>$("#shade").height(nHeight); <BR>//设置关闭按钮居中显示 <BR>$("#putPwd").css("margin-top",nHeight/2-50+"px"); <BR>}); <BR>//设置关闭按钮消除遮罩层 <BR>$("#close").click(function(){ <BR>$("#shade").removeAttr("id"); <BR>$("#shade").html(""); <BR>}); <BR>//也可用纯js来写 <BR>Document.getElementById(“shade”).style…….; <BR>//后面多说无益，如果有兴趣又实在不会写，可以和本人联系。 <BR>}) <BR>
