引用bootstrap的dialog组件,不过在移动端,dialog弹出,body还能滚动。
document.addEventListener('touchmove', function (event) {
//判断条件,条件成立才阻止背景页面滚动,其他情况不会再影响到页面滚动
if ($(".modal").css('display')=="block") {
event.preventDefault();
}
});
有一个bug 如果dialog高度比较高,dialog也不能滚动了呀。
想着只对蒙版进行绑定事件,不过bootstrap的dialog 的蒙版是动态出现的,渣渣的我不会取dom。(老司机带带我呀),刚刚用jquery取了一下,咋也没取到,道行不够呀。(评论告诉我为啥子)
不过是自己写的dialog可以这么操作。
document.getElementById('mask').addEventListener('touchmove', function (event) { //对蒙版绑定touchmove的属性
//判断条件,条件成立才阻止背景页面滚动,其他情况不会再影响到页面滚动
if ($(".modal").css('display')=="block") {
event.preventDefault();
}
})
-----------------------------------------分割符-----------------------------------------------------
补充新方法:
我点击弹出按钮的时候给body加上一个class
.modal-open{overflow:hidden;} //安卓高版本还是有点问题,我的low比手机是好的
修改上面的class
.modal-open{overflow:hidden;positon:fixed;}
参考文章是:https://www.zhihu.com/question/35453154
当弹出隐藏的时候再把这个class去掉就能解决了。
弹出是我自己写的。。。。
不知道还有没有好的方法
参考:http://vr013.com/