移动端禁止滚动
写在前面的话:
在手机端常常遇到悬浮层,当悬浮层出现的时候手机的原来页面需要禁止滚动,而悬浮层可以滚动 的情况。
在移动端设置overflow:hidden为什么页面还能滚?要怎么禁止
http://blog.sina.com.cn/s/blog_4714e47801019f6o.html
今天用的是 fixed 的方法,下面几种方法的优劣待有空的时候来填~
方法一:
把原来页面上滚动的div的position设置成fixed,然后top:0,或者top设为$(window).scrollTop()(或者设置一个想要的top值,因为可能含有头部的高度,而头部不在原来的滚动范围内),
方法二:
把滚动的div的position设置成relative更好用些,再加overflow:hidden fixed会有个坑,慎入~
方法三:
ontouchmove,function(e){e.preventDefault();}
方法四:
可以将你要隐藏滚动的内容加上一个包裹层div,然后给这个div设置高度为window.height(),并且overflow:hidden,就可以解决问题了
方法五:
body{
overflow: hidden;
position:fixed;
}
或
$(document).on('touchmove',function (e){
e.preventDefault();
});
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】凌霞软件回馈社区,博客园 & 1Panel & Halo 联合会员上线
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】博客园社区专享云产品让利特惠,阿里云新客6.5折上折
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步