在PC浏览器上，弹出层出现了后，要阻止滚动传递给底层的，只需要将body的Style设置:
height: 100%；
overflow: hidden;
就能实现，可是移动端浏览器无论是Android还是iOS都无法阻止body滚动，怎么办呢？
其实只要将body的style加多一个属性：position: fixed; 就OK啦！
JS实现：
function showLeftBar() {
if(leftBar.hidden) {//显示leftBar
leftBar.hidden=false;
body.style.overflow="hidden";
body.style.position="fixed";
}else{//隐藏leftBar
leftBar.hidden=true;
body.style.overflow="auto";
body.style.position="";
}
}
在PC浏览器上，弹出层出现了后，要阻止滚动传递给底层的，只需要将body的Style设置: height: 100...
遮罩层的获取页面高度 pc端 移动端应加上 阻止浏览器默认滚动行为，即阻止弹出层底部滚动 jq对象和dom对象的转...
解决PC/移动端弹出层滚动穿透的问题。 描述 弹出层内容滚动时，body跟随滚动。 方案 法一： overflow...
问题1：当页面出现弹出层，弹出层和底层均有滚动条，滚动弹出层，底层跟着滚动（滚动穿透） 处理：该问题原因是弹出层的...
Q： 移动端禁止弹出层背景滚动方案一： document.body.style.overflow = 'hidde...
定义：移动端弹出fixed弹窗的话，在弹窗上滑动会导致下层的页面跟着滚动，这个叫“滚动穿透” 解决方案1 在弹出层...
众所周知，移动端当有 fixed 遮罩背景和弹出层时，在屏幕上滑动能够滑动背景下面的内容，这就是臭名昭著的滚动穿透...
首先，在触发弹出浮层事件后添加下面代码： passive参数：是否让 阻止默认行为(preventDefault(...
场景：背景内容超出屏幕高度，需滚动展示；底部弹窗内容超出底部容器高度，需在容器内滚动展示；当底部弹窗打开，需阻止背...
移动端 阻止默认事件 PC
本文标题：阻止移动端弹出层的滚动事件传递给底层的简单方法
本文链接：https://www.haomeiwen.com/subject/gyjevxtx.html
网友评论