Question

我注意到一些奇怪的东西似乎只出现在iPhone Safari上：

如果内容不高于视口，则无论如何都可以滚动一点。甚至可以在空白页面上滚动一点点。（Safari顶部栏的高度？）

截图：

我在iPhone Portrait或iPad上看不到这个问题。我在模拟器中尝试了iOS 8和9。

我正在创建一个webapp，如果正文不高于视口的100％，我也不希望发生这种情况。

尝试一下：

<html>
<head>
    <style>
        html, body {
            overflow:hidden;
        }
    </style>

    <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,minimum-scale=1">
</head>
<body>
    123
</body>
</html>

Answer 1

更新的答案：

我找到的最佳解决方案是删除默认移动事件。这不会删除具有链接和功能但阻止页面可滚动的功能。然后，您将使用@media设计页面，以创建横向/纵向和各种屏幕尺寸的自定义css。在评论中链接@media示例。然后，您可以通过jquery或javascript实现滚动条。自从IOS 8 minimal-ui for viewport meta已被删除，并且没有关于横向屏幕高度问题的简单方法。

＆＃13;

document.ontouchmove = function(event){
    event.preventDefault();
}

＆＃13;

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

＆＃13;

<html>
<head>
    <meta name="viewport" content="initial-scale=1,user-scalable=no,maximum-scale=1,minimum-scale=1">
</head>
<body>
     123456
</body>
</html>

＆＃13;

iPhone风景甚至在空白页面上滚动

1 个答案: