在移动端中,由于机型的不同,往往在弹窗的时候会出现页面的穿透事件,使得原页面还是能够进行滑动,这是我们不想看到的效果。
首先,建立一个函数
function bodyScroll(event){
event.preventDefault();
}
之后在触发弹窗的时候禁止页面滚动
document.body.addEventListener('touchmove',bodyScroll,false);
$('body').css({'position':'fixed',"width":"100%"});
关闭弹框时开启页面滚动
document.body.removeEventListener('touchmove',bodyScroll,false);
$("body").css({"position":"initial","height":"auto"});
注意:切不可以下写法
document.body.addEventListener('touchmove', function (event) {
event.preventDefault();
},false);
document.body.removeEventListener('touchmove', function (event) {
event.preventDefault();
},false);
---------------------
原文:https://blog.csdn.net/m0_37852904/article/details/79300719
也可以用下面情况: 1.遮罩层显示时处理 body{overflow:hidden;},一定要在关闭遮罩层时处理掉 body{overflow: initial;} 2.fastclick 库
let scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop; 可对滑动高度进行处理
网友评论