jQuery UIのDraggableをスマートフォンで動かす

昨日、jQuery UIのDraggableがiPhoneのsafariだと動かないって話を書いたので、ついでにどうしてもdraggableにしたい場合はどうするんだろうと思って調べた。

これを使えばできそうなので試してみた。
furf/jquery-ui-touch-punch

使い方はjQuery UIの後でライブラリを読み込むだけ。

これで普通にdraggableすれば、スマートフォンのタッチでマウスのドラッグみたいなことができるようになる。

<script src="js/jquery-1.9.1.js"></script>
<script src="js/jquery-ui-1.10.3.custom.js"></script>
<script src="js/jquery-ui-touch-punch-master/jquery.ui.touch-punch.js"></script>
<script>
    $(function () {
        $('.box').draggable();
    });
</script>

これなら、ChromeのEmulates touch eventsにチェックが入っていてもドラッグできる