关于 js 弹出层插件

Question

js弹出层

Answer 1

加2个遮罩层就可以了。一个遮罩层是半透明的底，一个遮罩层包含一张图片。
jquery写法：
<script type="text/javascript" src="http://lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js"></script>
<script>$(function(){
$(document.body).append('<div id="mask-layout" style="background-color:#000000;height:'+$(document).height()+'px;width:'+$(document).width()+'px;left:0px;right:0px;position:absolute;z-index:10000"></div>')
//上面是半透明遮罩层，注意z-index要小于顶栏的z-index才不会遮住顶栏
$('#mask-layout').css("opacity",0.7);
$(document.body).append('<div style="position:absolute;top:'+$('#顶栏的id').height()+'px;right:0;z-index:比mask-layout的大。"><img src="那堆字是gif或者png图片" /></div>')
})
    </script>

Answer 2

谢谢谢谢，但是粘进去图片显示出来了，但是没有黑色的北京？这个z-index是什么意思呢？

Answer 3

查了一下z-index，我也将最上面的div的z-index设置为2.这里的设置为1，但是还是没有背景颜色。。

Answer 4

你先把下面这行注释掉看看底层
$(document.body).append('<div style="position:absolute;top:'+$('#顶栏的id').height()+'px;right:0;z-index:比mask-layout的大。"><img src="那堆字是gif或者png图片" /></div>')

Answer 5

z-index是层的z轴高度值，比如有2个浮动层，z-index为1的被2遮住。
position非默认和static时才有作用。

Answer 6

恩恩，谢谢~实现了~那如果需要完成点击一下黑色背景和图片都消失的话，我在里面加了一个onclick的方法，方法里面写着让这个mask-layout和那个picture都hide了。。但是可以实现消失，但是第二次再点分享朋友圈的话，北京就会成为纯黑的，而且没有点击消失的效果了？？请问这是问什么呢？

Answer 7

恩恩，谢谢~实现了~那如果需要完成点击一下黑色背景和图片都消失的话，我在里面加了一个onclick的方法，方法里面写着让这个mask-layout和那个picture都hide了。。但是可以实现消失，但是第二次再点分享朋友圈的话，北京就会成为纯黑的，而且没有点击消失的效果了？？请问这是问什么呢？
不要hide()，要remove()。