如何解决body的overflow:hidden;在移动端失效

作者: BrightenSun | 来源:发表于2017-12-14 10:44 被阅读1036次

在PC端中百试不爽的document.body.style.overflow='hidden';可以使屏幕滑动时而不滚动，但是在移动端却达不到效果了，我在网上也看过一些资料，有说加上html,body 它们的高度设置为100%，就可以解决这个问题，但在我的尝试中一样没有效果，那如何解决呢？

可以给设置

document.body.style.position='fixed';

使body根据屏幕定位，这样你如何滚动body都还是在你屏幕定位的地方。

当你想让屏幕继续滚动的时候可以设置

document.body.style.position='static';

恢复定位的默认属性，这样就代替了document.body.style.overflow='hidden';在移动端失效的效果了。

如何解决body的overflow:hidden;在移动端失效
在PC端中百试不爽的document.body.style.overflow='hidden';可以使屏幕滑动时而...
开发笔记5-body设置overflow依然能滚动的禁止办法
body标签设置了overflow:hidden后，在移动端依然能够滚动，查了一些文章后，设置body宽高为100...
关于在移动端 body overflow：hidden 无效的问
关于在移动端 body overflow：hidden 无效的问题一、简述这篇文章作为一道前菜哈。很多同学在...
移动端中关于overflow的修复
移动端在使用overflow-x:hidden属性时，如果直接加在body上无效，需将内容包裹在另一个div标签中...
移动端兼容整理
Updating... IOS 端box-radius/overflow:hidden失效ios端设置box-ra...
IOS 解决border-radius overflow:hi
IOS 解决border-radius overflow:hidden 失效问题父元素添加
移动端overflow:hidden
平时PC端经常会用overflow：hidden 去解决好多问题。不过最近做的项目是移动端微信公众号，并不支持这...
手机端 overflow:hidden 失效
overflow:hidden在IOS移动端
overflow:hidden在IOS移动端问题页面上有个弹出窗，弹出窗出现后禁止弹框上下滚动弹框内容...
移动端浏览器和微信浏览器上禁止body的滚动条
一般禁止body滚动的做法就是设置overflow:hidden。但是很奇怪的发现在移动端浏览器和微信浏览器上这...