禁止蒙层底部页面跟随滚动
场景概述 弹窗是一种常见的交互方式，而蒙层是弹窗必不可少的元素，用于隔断页面与弹窗区块，暂时阻断页面的交互。但是，在蒙层元素中滑动的时候，滑到内容的尽头时，再继续滑动，蒙层底部的页面会开始滚动，显然这不是我们想要的效果，因此需要阻止这种行为。 那么，如何阻止呢？请看以下分析： 方案分析 ...
原文：web页面弹出遮罩层,通过js或css禁止蒙层底部页面跟随滚动
场景概述 弹窗是一种常见的交互方式，而蒙层是弹窗必不可少的元素，用于隔断页面与弹窗区块，暂时阻断页面的交互。但是，在蒙层元素中滑动的时候，滑到内容的尽头时，再继续滑动，蒙层底部的页面会开始滚动，显然这不是我们想要的效果，因此需要阻止这种行为。 那么，如何阻止呢 请看以下分析： 方案分析 方案一 打开蒙层时，给body添加样式： 在某些机型下，你可能还需要给根节点添加样式： 关闭蒙层时，移除以上样式 ...
2020-06-02 10:53 0 1474 推荐指数：
相关推荐
弹出遮罩层后，如何禁止底层页面的滚动
弹窗是一种常见的交互方式，而蒙层则是弹窗必不可少的元素，用于隔断页面与弹窗区块，暂时阻断页面的交互。但是，我们会发现，当弹出遮罩层后，底层body的内容也是可以滚动，显然这不是我们想要的效果，而这个问题就是小萌最近开发项目时遇到的问题。 一个小程序的项目，是用MPVUE(一个使用 Vue.js ...
蒙层禁止页面滚动的方案
蒙层禁止页面滚动的方案 弹窗是一种常见的交互方式，而蒙层是弹窗必不可少的元素，用于隔断页面与弹窗区块，暂时阻断页面的交互。但是在蒙层出现的时候滚动页面，如果不加处理，蒙层底部的页面会开始滚动，实际上我们是不希望他进行滚动的，因此需要阻止这种行为。当弹出蒙层时禁止蒙层下的页面滚动，也可以称为滚动 ...
遮罩层下禁止页面滚动
// 封装禁止页面滚动方法（该方法兼容PC端和移动端）var topSpace = 0function BodyScroll (isState) { var bodyDoc = document.body if (isState) {topSpace = window.scrollYbodyDoc ...
移动端弹出遮罩层禁止页面滚动，遮罩里面的框不允许滚动
在遮罩层添加 (前提使用vue)@touchmove.prevent HTML: ...
mask 遮罩层弹窗禁止页面滚动
1、css 样式： .mask{ background: rgba(59, 59, 59, 0.9); /* opacity: 0.9; */ position: fixed; top: 0; left: 0; width: 100 ...
HTML JS 弹层后底部页面禁止滚动处理
1.打开新页面时需要禁止鼠标滚轮，禁止页面滑动 ...