移动端弹窗禁止滚动问题

Question

弹窗禁止滚动

.mask{display: block; position: fixed;top: 0;right: 0;bottom: 0;left: 0; overflow: hidden;background-color: rgb(0, 0, 0);filter: alpha(opacity=60);  background-color: rgba(0, 0, 0, 0.6); z-index: 5;}

$('.mask').on('touchstart',function(e){
    //event.preventDefault();
    e.preventDefault();
});

遮罩底层不滑动，移动端有个侧边栏，滑动侧边栏，滑动侧边栏底层也影响滑动，问题求解决

.side{position: fixed; top: 50px; bottom: 0; left: 0; overflow-x: hidden; width: 200px; z-index: 99;}

自己填坑：
PC端
http://www.zhangxinxu.com/wor...
移动端
http://www.zhangxinxu.com/wor...

Answer 1

你的JS代码写错了

$('.mask').on('touchstart',function(e){
    e.preventDefault();
});

Answer 2

给.side也上一个

$('.side').on('touchstart',function(e){
    event.preventDefault();
});

Answer 3

额···，我是直接把html和body的高设为100vh，关了遮罩再恢复auto···，貌似普适度不广。