[JS] スマホでclickイベントより早くユーザーのタップ動作に反応する - YoheiM .NET
こんにちは、@yoheiMuneです。 最近スマホでのWebアプリを開発することが多いのですが、タップへの反応速度を上げるこんな方法はどうかなぁと考えたので、ブログに書きたいと思います。 スマホでタップにより速く反応したい スマホ用Webアプリの開発で、ユーザーがタップした際にJSを起動したい（例えばダイアログを表示したいなど）という要件があるとします。 その場合に、タップ対象の要素のonclickにイベントをバインドして処理をすることが多いかと思います。 こんな感じ。 var btn = document.getElementById('someBtn'); btn.addEventListener('click', function() { // タップされた際の処理 }); でもこれだと確かに反応するのですが、ユーザーがタップしてからイベントが発火するまでに時間が空いてしまい、遅いの
![[JS] スマホでclickイベントより早くユーザーのタップ動作に反応する - YoheiM .NET](https://cdn-ak-scissors.b.st-hatena.com/image/square/cccc0e0910f5e6c670ca8c44cd50ffd6640ce4ae/height=288;version=1;width=512/https%3A%2F%2Fwww.yoheim.net%2Fimage%2F216.jpg)
スマホでシングルタップのレスポンスを向上させるjQueryプラグイン
スマホ（スマートフォン）ではWebページのリンクがタップしてからページ移動を開始するまでやや遅く感じることが多い。 調べてみるとスマホ上では、タップしてからクリックイベントが発生するまで約300msの遅延が発生しているとのこと。 Remove onClick delay on webkit for iPhone うのらぼ。 – 【JS】iPhoneでタップの反応が遅いと感じたら そこでtouchstart/touchendイベントを利用してシングルタップを高速に判定するjQueryプラグインを作ってみた。 実装概要 まずタップ検出対象に対して、touchstartが呼ばれたらtouchmoveおよびtouchendにリスナを設定。 タッチしてから指を離すまでに移動が無ければタップと判定し、カスタムイベントのtapを発火します。 それから従来のクリックイベントも同時に発火させるようにしました
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
