zukucode
主にWEB関連の情報を技術メモとして発信しています。

JavaScript モバイルでのクリックイベントの遅延を改善する

スマホなどのモバイル端末ではタップなどのイベントもあるのでクリックイベントは少しタイムラグが生じます。

対策として、タップイベントが対応している場合はクリックイベントではなくタップイベントで処理を実装するわけですが、全てのクリックイベントの処理を書き換えるのは大変です。

FastClickのライブラリを導入すれば簡単にクリックイベントの遅延を改善できます。

パッケージのインストール

fastclickのパッケージをインストールします。

$ npm install --save-dev fastclick

ロードイベントで読み込み

windowのロードイベントでfastclickの読み込みを行います。

import FastClick from 'fastclick';

window.addEventListener('load', () => {
  FastClick.attach(document.body); // FastClickを導入
});

以上で、fastclickの導入は完了です。


関連記事