最近要写一个h5的自适应的界面,要求弹框出来的时候禁止滑动的问题
百度上的资料大部分都是互相摘抄很乱,自己总结了一下其实很简单的问题被他们说的复杂了。
pc端禁止滑动很简单的:
$('html,body').css("overflow","hidden");
pc只需要让body或者html的css 的overflow属性hidden就行了,恢复滑动的话直接去点这个
属性就行 $('html,body').css("overflow",""),还有其他方法。
移动端:
大部分的答案
document.addEventListener('touchmove', function(){
e.preventDefault();
}, false);
touchmove是监听手机触摸移动的一个时间当然还会有touchstart等事件,
然而你会发现谷歌会报这个问题
新版的谷歌浏览器preventDefault()不再是清除浏览器默认行为了。document.addEventListener('touchstart', function(event) {
// 判断是否可以被禁用
if(event.cancelable) {
// 判断是否已经被禁用
if(!event.defaultPrevented) {
event.preventDefault();
}
}
},false);
当然方法许多如监听滚动事件等等
网友评论