タップやピンチなど、タッチデバイス特有のイベントをサポートする2KBの軽量jQueryプラグイン・Hammer.js

タップ、ダブルタップ、ピンチや
長押しなど、タッチデバイス特有
のイベントをサポートしてくれる
JSライブラリ・Hammer.jsのご紹介。
2KBと軽量なのでいつか使うと思っ
て記事にしておきます。

jQuery依存みたいです。

ある世代にはなつかしいと思う方がモデルとして登場してます。

Hammer.js

サポートしてるイベントはタップ、ダブルタップ、ピンチ、ドラッグ、長押しの5イベント。

動作テストはiPadでのiOS5、iPhone4でのiOS5、Samsung Galaxy SのAndroid 2.3.3とGoogle Chrome 17だそうです。僕は3GSなんですが、一応動いてました。

コード

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js'></script>
<script src="hammer.js"></script>

本体とhammer.jsを読み込む。

var hammer = new Hammer("#foo");

で、要素にバインドさせます。

var hammer = new Hammer("#foo", {
        prevent_default: false,
        drag_vertical: false
    });

例えばドラッグだったらこのようにする。

軽量ですけど、諸々を宜しくやってくれる、というものではなく、あくまでサポートって感じですね。いつか役に立ってくれるかな？と思ってメモとして残しました。

Hammer.js