首页 > 代码库 > 移动端遮罩层，放在页面最上面，并且不能滚动

移动端遮罩层，放在页面最上面，并且不能滚动

2024-10-09 00:14:02   214人阅读

点击弹出遮罩层，需要规定到页面最上面，并且不让其滚动；

点击添加一个类：

.maskstyle{
    width:100%;
    height:100%;
    position:fixed;
    overflow:hidden;
}
.mask{
    diaplay:none;
    poaition:acsolute;
    left:0;
    right:0;
    top:0;
    bottom:0;
    background:rgba(0,0,0,.3);
    z-index:2;
}

js控制显示隐藏

显示：
    $(".mask").show();
    $("html,body").addClass("maskstyle");
    

隐藏：
    $(".mask").hide();
    $("html,body").removeClass("maskstyle");

 

移动端遮罩层，放在页面最上面，并且不能滚动


联系
我们