Adobe Indesign -Webコンテンツオーバーレイ - スクロールイベントの泡立ちを防ぐ

StackOverflow https://stackoverflow.com/questions/19834729

質問

Webコンテンツオーバーレイ(レスポンシブWebサイトを指す)を含むIndesignマガジンがあります。スクロールに関しては、すべてが正常に機能します。

垂直スクロール(上下)のみが必要です。水平ではありません。

問題

ユーザーが左または右にスワイプすると、雑誌のページが変更され、Webコンテンツが閉じます。

質問

スクロールイベントがWebコンテンツオーバーレイから雑誌まで伝播するのを防ぐことができる方法はありますか?できれば、これはWebコンテンツ自体(JavaScriptを使用するなど)から実行されます。これは、Webコンテンツが表示されるのではなく、各ページではなく、1つの場所で編集する必要があることを意味するためです。

試みた

  • キャッチ touchmove ページのボディと呼び出しのイベント stopPropagation() その上。
  • 電話 preventDefault() イベントで(これにより、スクロールが停止します)。
  • Pagexを使用します touchmove イベントと呼び出し preventDefault() 水平方向のスワイプであると思われるもの(信頼性が高すぎます)。
  • CSSを使用します overflow-x: hidden
  • JQuery Mobileのカスタムスクロールイベント。
  • 上記のいくつかの組み合わせ。
役に立ちましたか?

解決

解決策を見つけました。まず、aを挿入します <meta> viewport 頭のタグ:

<meta name="viewport" content="width=701, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1.0, user-scalable=no" />

の静的幅を設定したことに注意してください 701, 、 これは重要。 Webコンテンツオーバーレイの幅はです 700px. 。の幅を設定します 701 ページが少しでも移動できることを意味します。この小刻みは、スワイプが左/右に捕まえられ、Indesignまで浸透していないことを意味します。スワイプするとわずかなシフト(ピクセルによる)がありますが、ページの変更に比べてマイナーです。

次に、次のCSSをコンテンツに追加します。

.content {
    -webkit-overflow-scrolling: touch
}

このCSSは必要ないかもしれませんが、私たちにとって必要でした。

ライセンス: CC-BY-SA帰属
所属していません StackOverflow
scroll top