Mobile Safari でのスクロールを防ぐにはどうすればよいですか?

Mobile Safari でのスクロール動作の制御

Web サイトには広範なコンテンツがあり、ページのスクロールを制限して、ページの範囲外の情報を隠す方法を探しています。ビューポートの表示領域。この機能は、特に iPhone および iPad デバイスで重要です。

最初のトラブルシューティングの試行

オーバーフローの実装: 非表示;

のみにのみCSS 内では、モバイル Safari でのスクロールの問題は解決されていないようです。さらに、Web サイトの包括的なラッパーを作成することは実行可能な解決策ではありません。

効果的な解決策

モバイル Safari でスクロールを効果的に無効にするには、次のアプローチを検討してください。

• オーバーフローを適用: 非表示; の両方にそして CSS 内の要素。この手法は、同様のスクロールの問題の解決に効果的であることが証明されています。

html,
body {
    overflow: hidden;
}

• iOS 9 デバイスの場合は、別の解決策が必要になる場合があります:

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

これらの CSS 調整を実装すると、モバイル Safari でのスクロールを防止し、ページのコンテンツが表示範囲内に留まるようにすることができます。ビューポート。

以上がMobile Safari でのスクロールを防ぐにはどうすればよいですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。