ドラッグ＆ドロップのJavaScriptライブラリを作ってみた

Draggable.js


JavaScriptのドラッグ＆ドロップは既出でいっぱいあって、有名どころではscript.aculo.usとか、Ricoとかがある。要求仕様がこれらの動きでまかなえれば全く問題ないけれど、もっと違う動きが必要だったりするときに、元が多機能なだけにコードの修正がやり難い。なので、単純にドラッグ＆ドロップの実装だけのライブラリを書いてみた。
使い方はリンク先に書いてあるけれど、簡単な使い方をご紹介。


まずはスクリプトをロードして、

<script type="text/javascript" src="./Draggable.js"></script>

position=absoluteな要素を設置する。

<div id="hoge" style="position:absolute;">Hoge</div>

そしてJavaScriptでその要素をnewして終わり。

new Draggable("hoge");

実際のアプリケーションだと、ドラッグ中に下のテキストを選択できないようにしたりだとか、ドラッグしてるものを透過したりだとか、ドロップできる範囲を指定したりだとかが出てくると思う。
それなりにクロスブラウザには作ってはあるので、使えそうであれば、どうぞご利用ください。