web-dev-qa-db-ja.com

iPad SafariでWebページ間のスワイプを防止する

IPadのSafariブラウザの左端と右端からスワイプすると、現在開いているWebページ間を移動します。それを防ぐ方法はありますか？

ページのエッジにtouchstartハンドラーとtouchmoveハンドラーをstopPropagationとpreventDefaultと追加しようとしましたが、効果がないようです。 touch-action CSS。

同様の質問が2014年にネガティブへの返信で尋ねられました： iOS 7-Safariでスワイプの前後移動機能を無効にする方法はありますか？

2018年に回避策はありますか？

javascripthtmlioscsssafari
11
ᴇʟᴇvᴀтᴇ

この機能を無効にする方法はないようです。そのため、回避策として、ページの両側に24pxのデッドゾーンがあれば、意図しないナビゲーションを停止するのに十分であるように見えます。

ここに私のCSSがあります：

body {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 24px;
  right: 24px;
  background-color: #ccc;
}

体作りposition: fixedはまた、Safariが迷惑なオーバースクロール/バウンス効果を実行するのを停止します。

3
ᴇʟᴇvᴀтᴇ

AppleはiOS9の後にこれらのガイドラインを提供しました。

ガイドでは、無効にすることができます

  1. スクロール

    function touchMove(event) {
  // Prevent scrolling on this element
  event.preventDefault();
  ...
}

  2. ピンチとズーム

    function gestureChange(event) {
  // Disable browser zoom
  event.preventDefault();
  ...
}

次のようにスワイプジェスチャーを識別できます。

  1. ターゲットタッチを1つ含むtouchstartイベントを受け取った場合は、ジェスチャーを開始します。
  2. 1回を超えるタッチでイベントを受け取った場合は、ジェスチャーを中止します。
  3. ほとんどx方向のタッチムーブイベントを受け取った場合は、ジェスチャーを続行します。
  4. 主にy方向のタッチムーブイベントを受け取った場合は、ジェスチャーを中止します。
  5. Touchendイベントを受け取ったらジェスチャーを終了します。

完全なガイドはポスター ここ です。

さらにサポートが必要な場合はお知らせください。

ニチン、 Defuzed

2
Nitin K.

ナビゲーション履歴がある場合、スワイプジェスチャーでのナビゲーションが可能です。左にスワイプすると「ナビゲーション履歴の前のページに戻ります」です。

たとえば、アプリにナビゲーション履歴が必要ない場合、たとえば1画面ゲームで完全に有効な場合は、ナビゲーション履歴を削除することで、スワイプの問題を防ぐことができます。

たとえば、メモリ内の履歴のみを使用する単一ページアプリケーションがあり、ブラウザと同期していません（履歴/ URL）。そのため、「スワイプ」にこの問題を「修正」する場所はありません。

とはいえ、これは回避策であり、状況によっては十分ではない可能性があるという制限があります。 （URL共有はインターネットの基本的なものです）

ブラウザーベンダーの使命は、そのような愚かなことでWeb開発者の生活を惨めにすることです。

0
Kev

できません。iOSの初期の頃から問題になっています。彼らは、Service WorkerやWebGLなどの強力なWebアプリ機能に繰り返し足を引っ張っています。

あなたができる最善のことは、すべてのブラウザーで何をすべきかであり、すべてのブラウザーで機能検出を使用してできる最高の体験を作ります。すべてのサイトをすべてのブラウザーで同じに見えるようにする時代は終わりました。

必要に応じてサンドイッチを使用し、それをサポートするブラウザでサイドスワイプを許可します。残りのユーザーの利益のために、いくつかのブラウザーで小さな機能を無効にすることは恥ではありません。

0
Francis Bitterworth

<body>タグでこれを試してください：

onload='ontouchmove()="return(function(event) { event.preventDefault(); event.stopPropagation(); return(false); } );"'

移動についてIOSを知らせないことによっていくつかの副作用があるかもしれないと想像しますが、SPWの場合、それらはおそらくわずかです。

0
G. Andrews