視差のあるストリート シーンの Web サイトを作成しました。アーカイブ版はこちらをご覧ください。
すべての主要なデスクトップ ブラウザーと Safari Mobile で問題なく動作します。Mobile Firefox と Chrome for Android Beta でも問題なく動作します。ただし、デフォルトの Android ブラウザーにはスクロール イベントに関する問題があります。はっきりさせてください。スクロールは問題ではありません。div は必要に応じてスクロールします。スクロールイベントは発生しません。この問題は、ハニカムと ICS で発生します。
モバイルの画面サイズでは通常、視差シーンが表示されないため、他のモバイル ブラウザーについては心配していません。メディアクエリと条件付き JavaScript 読み込みがそれを処理します。レスポンシブ デザインとすべてのジャズ。
基本的に、位置と「深さ」に基づいて各画像を配置する parallise() jQuery プラグインを作成しました。この関数は、スクロール イベントにバインドされています。
Android ブラウザでは、このイベントは継続的にではなく、次のタッチの開始時にのみ発生します。
touchstart
わかりましたので、関数を、touchmove
、およびtouchend
イベントにバインドすると、問題が解決するのではないかと思いました。葉巻はありません。他のタッチ イベントにもバグがあります。提案された回避策を適用すると、イベントが発生しますが、必要に応じてe.preventDefault()
、スクロール (演習のポイント全体) が無効になります。
ウィンドウ div に対するステージ div の位置をポーリングするとどうなりますか? 位置情報は、次のタッチの開始時にのみ更新されることが判明しました。
私はテザーの終わりにいます。どんな助けでも大歓迎です。