iPad环境中的额外机身高度,没有正文内容(iOS7)

Question

问题:
在横向模式下在iOS7 iPad上加载上面的URL时,会有一个垂直滚动条.有没有身体的内容,它的标准化身体/ HTML保证金/填充.要明确这是我可以提供的最小测试用例,因此缺少内容和空白页面.

演示:http :
//fiddle.jshell.net/AKRCa/show/

我尝试过的事情:
将视口设置为:

<meta name="viewport" content="width=device-width, initial-scale=1.0">

和

<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">`

其他一些信息:
我无法访问运行iOS6的iPad,但我使用browserstack在运行iOS6的iPad3上测试了该演示,并且没有滚动条,所以看起来这个bug仅限于iOS7.

iPhone肖像也没有滚动条,但iPhone风景确实如此.

Answer 1

好吧，经过一些测试（结果在这里）我决定了两件事：

1. 这个错误（至少我认为这是一个错误......）与 webkit 滚动有关，实际上并不影响您的网站/应用程序的高度

2. 如果您要创建的是单页应用程序，则需要向其中添加此 JS 以防止触发任何滚动事件。这也将防止弹性滚动效果和垂直滚动条问题。

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

JsFiddle展示了我所做的实验。希望有帮助！