H5给页面增加遮罩层

遮罩的css样式:

.mark{
    position:fixed;
    left:0;
    top:0;
    opacity:.5;
    width:100%;
    height:100%;
    background:#000;
    z-index:998;
    pointer-events: none; //不能操作
}

 遮罩整个页面,动作不能穿透遮罩层,如果需要穿透去掉pointer-events:none;

为需要显示遮罩的元素加上mark类:

$('#test').addClass('mark');

去除遮罩效果:
$('#test').removeClass('mark');

发布了163 篇原创文章 · 获赞 46 · 访问量 17万+

猜你喜欢

转载自blog.csdn.net/liangmengbk/article/details/102566267
今日推荐