jQuery for スマホ

2012.04.23

Seanです。

最近、スマートフォン(以下、スマホ)向けにJSを書くことがあり非常に勉強になったので、シェアしたいと思います。
スマホサイトにJSを導入する際 (特にスライドショー) 、PC向けと大きく違う点が、フリック操作です。(指でスワイプすると、画像がスライドする等)
少し大変な作業ではありますが、スマホサイトを制作していくにあたり、この先必須となることは間違いありません。
これはjQueryで以下のイベントを使用することにより、実現可能となります。

touchstart
touchmove
touchend
touchcancel
gesturestart
gesturechange
gestureend

たくさんありますね。非常に簡単な説明になってしまいますが、touchイベントは指を動かし始めた時、動かしている時、動かし終わった後という感じで分けられています。
gestureイベントは2本以上の指で操作をした時、という感じです。
これらを駆使して、ユーザーの指の動きを感知し、制御していくことになります。
僕もこれもっと勉強しなければ。。。

jshcl

一覧へ