如何禁止页面向下滑动
发布网友
共1个回答
热心网友
1，依靠css 将页面
document.documentElement.style.overflow='hidden';
document.body.style.overflow='hidden';//手机版设置这个。
如果设置了如上，页面的滚动条将会消失，此时鼠标滚轮失效。
但是 你用键盘的 上下左右键，你会发现，页面仍然可以滚动。 别着急 往下看
2，在 1 的基础上 添加 js功能
var move=function(e){
e.preventDefault && e.preventDefault();
e.returnValue=false;
e.stopPropagation && e.stopPropagation();
return false;
}
var keyFunc=function(e){
if(37<=e.keyCode && e.keyCode<=40){
return move(e);
}
}
document.body.onkeydown=keyFunc;
好了 ，到了这里，你会发现页面木有任何问题了。鼠标，键盘 都不能将页面滚动。
不过....对于高级用户来说，仍然有问题，比如 继续往下看
3，假设用户希望 滚动条 一直处于显示状态 肿么办捏？？？？ ok ,继续
var st
var scroll=function(e){
clearTimeout(st);
st=setTimeout(function(){
window.scrollTo(loc.scrollLeft,loc.scrollTop);
},5);
}
window.onscroll=scroll;
上述代码 可以似的 用户的任何滚动操作，都将被还原。注意这个方式很消耗内存（虽然做了setTimeout），但是谁让需求比较二*呢对吧~
