移动端禁止页面下滑

 

背景：

本人开发移动端h5时，想让页面禁止向下滑动，最初的代码如下：

html,body{
    overflow: hidden;
} 

 

在chrome移动端调试工具中可以，但是用iphone的微信打开，失效了。

 

解决方案：

方法一：

html,body{
    position:fixed;
    overflow-y:hidden;
}

方法二：

html,body{
    overflow: hidden;
    width: 100%;
    height:100%;
} 

 

参考资料：移动端如何禁用横向滚动条? - 前端开发 - 知乎