5

問題:
上記の URL を iOS7 iPad でランドスケープ モードでロードすると、垂直スクロール バーが表示されます。body contentはなく、body/html margin/padding を正規化しています。明確にするために、これは私が提供できる最小限のテストケースであるため、コンテンツと空白ページが不足しています。

デモ:
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 にはアクセスできませんが、ブラウザスタックを使用して iOS6 を実行している iPad3 でデモをテストしましたが、スクロールバーがなかったため、このバグは iOS7 に限定されているようです。

iPhone の縦長にもスクロールバーはありませんが、iPhone の横長にはスクロールバーがあります。

4

1 に答える 1

3

さて、いくつかのテストの後（結果はここにあります）、私は2つのことに落ち着きました：

  1. このバグ (少なくとも私はバグだと思います...) は webkit-scrolling に関連しており、実際には Web サイト/アプリの高さには影響しません。

  2. 作成しているシングル ページ アプリの場合は、この JS をアプリに追加して、スクロール イベントがトリガーされないようにする必要があります。これにより、弾力性のあるオーバー スクロール効果と垂直スクロール バーの問題も回避できます。

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

JsFiddleは、私が行った実験を示しています。それが役立つことを願っています!

于 2013-11-22T15:57:20.733 に答える