码迷,mamicode.com
首页 > 其他好文 > 详细

vue 弹窗禁止底层滚动

时间:2019-01-29 20:27:16      阅读:256      评论:0      收藏:0      [点我收藏+]

标签:100%   doc   视图   logs   osi   def   over   htm   hid   

原因:底层视图高度超出百分百,加入弹窗后再苹果浏览器隐藏上下栏的情况下遮罩层没有完全遮住底层。

处理:打开弹窗后禁止底层滚动调用stop事件,关闭则开启底层滚动调用move事件。

let mo=function(e){e.preventDefault();};

stop(){
document.body.style.overflow=‘hidden‘;
document.body.style.position=‘fixed‘;
document.body.style.width=‘100%‘;
document.addEventListener("touchmove",mo,false);//禁止页面滑动
},
move(){
document.body.style.overflow=‘‘;//出现滚动条
document.body.style.position=‘initial‘;
document.body.style.height=‘1006px‘;
document.removeEventListener("touchmove",mo,false);
},

参考相关来源:

https://www.cnblogs.com/fanbi/p/9648184.html

https://blog.csdn.net/m0_37852904/article/details/79300719

vue 弹窗禁止底层滚动

标签:100%   doc   视图   logs   osi   def   over   htm   hid   

原文地址:https://www.cnblogs.com/min77/p/10335360.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!