jquery - 「ドラッグ」効果を防ぐために iOS ビューポートを修正

Question

iOS (iPhone および iPad) でブラウザのビューポートを「修正」して、スワイプ時のバックグラウンドの動きを防ぐ方法はありますか? 画面は 1024x768 の横向き/縦向きの寸法に適合するため、スクロールする必要はまったくありません..

スワイプ操作に応答して機能をトリガーするトレーニングサイトを構築する必要がありますが、画面が動くと、この効果がひどいものに見えてしまいます。

score 4 · Accepted Answer

ontouchmoveドキュメント全体のイベントをキャプチャして防止することができます。

HTML:

<body ontouchmove="BlockElasticScroll(event);">
    <!-- CONTENT -->
</body>

JS:

function BlockElasticScroll(event) {
    event.preventDefault();
}

ネイティブ JS にバインドする代わりに、.on()を使用して簡単にこれを jQuery に書き直します。

$("body").on({
    ontouchmove : function(e) {
        e.preventDefault(); 
    }
});

(jQuery コードはテストされていません)。

「時々」スクロールが行われるため、このアプローチは最後にチェックしたときに堅実ではないと言わざるを得ません。

また、 ScrollFixを参照して、フルスクリーン Web アプリを作成することもできます。

score 0 · Accepted Answer

コンテナ/ラッパーの div(s) (またはおそらく本体でさえ、私はそれをテストしていません) を設定max-width: 100%;すると、この問題が軽減されるようです。

2 に答える 2