モーションの最初の方向によって条件付きでタッチをキャプチャできる HTML5 インタラクションを作成することがどれほど実現可能かを調査しようとしています。
目標は、最初に水平方向に移動した場合にのみ、タッチのモーションをキャプチャして追跡することです。垂直方向にのみスクロールするレスポンシブなページ レイアウトと組み合わせると、水平方向のスワイプ モーションを使用して、追跡することで何かクールなことを実行できるはずです。
問題は、条件付きでタッチ シーケンス キャプチャを実行することが (特に iOS で) 不可能に見えることにあります。
タッチを追跡するには (つまり、時間の経過に伴う指の位置を表す x、y 座標のストリームを具体的に取得することを意味します)、touchstartページpreventDefaultがネイティブのモーメンタム スクロールに関与しないようにする必要があります。ネイティブの Momentum-Scroll は、動作中にすべての JS 実行 ( setTimeout、rAF、jQueryanimateなど...) と、CSS キーフレーム/アニメーション/トランジションの実行さえも中断します。
preventDefault()元のtouchstartイベントの を何らかの形で調整する方法があるかどうかを知りたいです。JS がそのイベント オブジェクトを保存し、後で (ネイティブ スクロールの開始を防止することに実際に関心があると判断されたとき) までそれを呼び出さないことは完全に可能です。
preventDefault()ただし、そのイベントで実行されないデフォルトの動作はネイティブ スクロールを使用するため、これは確実に失敗します。これにより、スクロールの残りの期間全体で JS の実行がブロックされます。に接続されたイベントリスナー関数を返さtouchstartないことは、オプションではないようです。それはすべてを凍らせるでしょう。
暫定的な答えは、追加の洞察なしで、すべてのスワイプをキャプチャできるようにする場合は、すべてのスワイプをキャプチャする必要があり、スクロールは外部手段（iScroll）[http:/ /cubiq.org/iscroll-5-ready-for-beta-test] (個人的には、何らかの種類の rAF の組み合わせを調査したいと考えてwindow.scrollToおり、iScroll 5 がこれらの API を採用していない場合は驚くでしょう)
ちなみに、そこにある 4 番目のデモの説明には非常に興奮しましたが、ページの残りの部分が規則的に動作している間、iScrolls を水平方向に実行するページ セクションを作成するだけであることがわかりました。これはまったくありふれたものです。