【jQuery】簡単に使えるタップ感度を上げるプラグイン

先日、スマホアプリのコーディングを仕事でやっていたんですが、
jQueryのclickイベントを使うと、スマホではタップしてからほんのわずかラグがあります。

時間でいうと1秒にも満たないと思いますが、
実際に触っているとけっこう気になります。

そこでタップ感度を上げるために真っ先に思い浮かぶのが、touchイベント。

touchstartを使えば感度は上がりそうです。

ただ、touchstartはタッチした瞬間反応してしまいます。
例えば、ボタンの感度をあげようとtouchstartを使ってしまうと、スクロール中にそのボタンに触れただけで反応してしまいます。

touchmoveやtouchendを組み合わせてごにょごにょ書けばいけるみたいですが。

そこで、fastclickというプラグインを使うと簡単にやってくれます。

ダウンロード

GitHubからダウンロードできます。

右上の緑のボタンを押して「Download Zip」をクリックしてください。

ダウンロードしたファイルの中にある「jQuery.fastClick.js」を読み込みます。

<script src="js/jQuery.fastClick.js"></script>

jQueryでの記述はすごく簡単です。

今まで「click」と書いていたところを「fastClick」に変えるだけです。

$('button').fastClick(function() {
  console.log('click');
});

すでにjQueryを書いてしまった後で、感度上げてよと依頼があっても簡単に導入できますね。

特にアプリのコーディングのように、いかにネイティブに近づけるかという時に使えるプラグインだと思います。

Pocket