スマホ、タブレット対応のjQueryスライダー
2011/12/11 | JavaScript/Ajax
jQueryで「スライダー」といえばjQuery UIのプラグインにあるようなバーを移動(スクロール)させて値を変化させるようなもののことだと思っていたら、実際はイメージスライダーというものばかりにぶち当たる。やっと希望のものが見つかったのでメモしておく。
スマホやタブレットでjQuery UIのスライダーを使おうとすると上手く動作してくれない。マウスでつまむ動作には対応しているものの、タップして移動、という動作には対応していないようだ。jQuery Mobileにはそれがあるのだが、単体では使えないっぽい。<input type=”range” />を使う方法もあり、それはスマホやタブレットでも動作してくれるが、IEで動いてくれない(IE9でもダメ)。
で、見つけたのがdragdealer。jQueryプラグインではないもののスマホ、タブレット、IE他ブラウザを問わず利用できるすぐれもの。コールバック関数callbackを引数で与えれば、変化後の値を読み取ることができるし、animationCallbackを引数で与えれば変化中の処理も与えることができる。
すごーい。しかもライセンスはMIT。いうことなし。早速使って見ることにする。