弹出新页面并使整个旧页面背景变暗功能的实现代码

时间：2019-08-28 15:30:16 阅读：92 评论：0 收藏：0 [点我收藏+]

效果： 技术分享图片

HTML： 技术分享图片

CSS：

div#cover{

background: #000;

position: absolute;

left: 0px;

top: 0px;

width: 100%;

filter: alpha(opacity=30);

opacity: 0.3;

display: none; z-index: 2;

}

div#showdiv{

width: 990px;

height: 800px;

margin: 0 auto;

border: 1px solid #999;

display: none;

position: absolute;

top: 40%;

left: 24%;

z-index: 3;

background: #fff

}

JS：

//点击联系我们

$("div.mainFrfth a").click(function(){

$(‘#showdiv‘).show(); //显示弹窗

$(‘#cover‘).css(‘display‘,‘block‘); //显示遮罩层

$(‘#cover‘).css(‘height‘,document.body.clientHeight+‘px‘); //设置遮罩层的高度为当前页面高度

});

$("span.gb").click(function(){

$(‘#showdiv‘).hide(); //隐藏弹窗

$(‘#cover‘).css(‘display‘,‘none‘); //显示遮罩层

})

原文：https://www.cnblogs.com/xzybk/p/11424190.html

踩

(0)

评论一句话评论（0）

分享档案

更多>