問題タブ [touchmove]

For questions regarding programming in ECMAScript (JavaScript/JS) and its various dialects/implementations (excluding ActionScript). Note JavaScript is NOT the same as Java! Please include all relevant tags on your question; e.g., [node.js], [jquery], [json], [reactjs], [angular], [ember.js], [vue.js], [typescript], [svelte], etc.

0 投票する
0 に答える
91 参照

javascript - 特別なセレクターにeventlistenerを追加するには?

H1 の皆さん、私の問題を解決するために助けを求めたいです。だから私が持っているもの:

クリックすると、パネルが左から右にスライドします

クリックしながらこのパネルにイベントリスナーを追加し、ユーザーがTOUCHMOVEの場合はパネルを閉じます。(誰かが方向をキャッチするのを手伝ってくれるなら(つまり、右から左へ)、それは素晴らしいことです!)

私が試したこと:

! document.addEventLister は、 touchmoving の後に常にこれを呼び出すため、解決策ではありません

PS私はウェブサイトのモバイル版のためにこれを書いています

誰かが必要とする場合にスワイプを検出するためにチェックされました:

http://www.javascriptkit.com/javatutors/touchevents2.shtml

0 投票する
2 に答える
389 参照

jquery - jQuery - touchmove を使用してメニューバーを非表示にしますが、スライドしなくなったら再び表示します

私は次のコードを持っています:-

jQuery

CSS

私は fullPage.js を使用していますが、これはデスクトップで正常に機能しています。次のページにスクロールするとメニューが非表示になり、アニメーション化されたメニューをスライドして固定位置に戻すのをやめると。

モバイルでは、メニューを下にスクロールすると、期待どおりに非表示になりますが、ナビゲーション バーは完全に消えます (つまり、removeClass("hide-nav-bar") が起動されることはありません)。

ユーザーがモバイル デバイスでスクロールを停止した場合にメニューを元に戻す方法はありますか?

編集:

e.originalEvent.touches[0].pageY実際、モバイル デバイスで動作するように追加すると、デスクトップ バージョンで動作しなくなります。

0 投票する
1 に答える
101 参照

javascript - マウスムーブとタッチノーブの違い

javascript の Mousemove イベントは、tot ms.IsToucmove イベントごとに 1 回トリガーされますか? Android では指を非常に速く動かすと動きが滑らかになり、代わりに mousemove の動きが滑らかでなくなるため、これを尋ねています。

0 投票する
1 に答える
578 参照

javascript - タッチムーブとマウスムーブの違い

マウスを非常に速く動かすと、マウスが数回トリガーされ、マウスを動かしたすべてのピクセルではなく、mousemove イベントが発生することに気付きました。

0 投票する
1 に答える
313 参照

javascript - モバイル デバイスで要素が画面外にドラッグされないようにする

上下にドラッグできる要素があります。ユーザーがページの一番上にいる場合、要素 ( div ) は上から 50px になるとドラッグを停止します (ユーザーが一番下までスクロールした場合も同様です)。

問題:ユーザーがページを少し下にスクロールすると、divがビューの外にドラッグされる可能性があります。上からも下からも見えなくなる前に止めてほしい。写真の携帯電話の画面では、画面の右側にある小さなボックスを上下にドラッグできますが、ページを上下にスクロールしてもビューの外にドラッグすることはできません。

ページがスクロールされているかどうかを把握し、それをドキュメントの高さなどから差し引く必要があることはわかっています...(またはそのようなもの)。または、私が知らないより良い解決策があるかもしれません。

これまでのところ、divをy軸に沿ってドラッグ可能にするものは次のとおりです。

0 投票する
0 に答える
486 参照

javascript - canvas要素にtouchmoveイベントを追加

こんにちは、

touchmove イベントを次のようなキャンバス要素に追加することは可能ですか? myGamePiece (w3c の学校から)。私はこのようなことを試しました:

しかし、コンソールログには次のように表示されます:

未定義のプロパティ 'addEventListener' を読み取れません

よろしく

0 投票する
1 に答える
597 参照

android - 向きが変わるまで Android Chrome の touchmove が断続的に遅くなる

私たちの JavaScript ゲームでは、「touchmove」イベントが遅くなり、向きが変わるまで「ぎくしゃく」し、その時点でイベントが再びスムーズになるという問題があります。

ゲームがレベルのロードなどの多くの作業を行うと、速度が低下します。

これは、動作中の遅いタッチ移動と、問題を修正する向きの変更を示すビデオです。

https://youtu.be/7rSqkJuOQjc


次の警告がログに表示されます

メインスレッドがビジー状態のため、「touchmove」入力イベントの処理が 141 ミリ秒遅れました。ページの応答性を高めるために、イベント ハンドラーを「パッシブ」としてマークすることを検討してください。

ただし、ゲームがレベルのロードやスプライトの構築などの重い作業を停止した後も、遅いイベントは持続します。

どのような場合でもパッシブ ハンドラーを使用することはできません。これは、マップのパンを防ぐ必要があり、インターフェイスのスクロールも停止する必要があるためです。


タッチハンドラーが呼び出される頻度を測定したところ、奇妙に見えるため、遅さはタッチイベントに関連していると思います。

20 ミリ秒未満で連続して 5 ~ 10 個のイベントを受信し、次に約 150 ~ 200 ミリ秒のイベントがあり、次に高速イベントの別のバッチがあり、別の低速イベントがあります。

向きの変更後、すべてのイベントは 20 ミリ秒未満で受信されます


requestAnimationFrame からの応答も測定しましたが、かなり堅実な 16.8ms のようです。


興味のある方は、 https: //blight.ironhelmet.com で問題を確認できます。

問題は Chrome と Cordova で発生し、ネイティブと Crosswalk を使用しています。この問題は、iOS 上の Safari またはテスト済みのデスクトップ ブラウザでは発生しません。


他の誰かがこの問題を抱えているかどうか、またどうすれば修正できるかを知りたいです。

javaScriptを使用して、「向きの変更」または向きの変更中に何が起こるかを強制することは可能ですか?