[JS]シンプルだけど高性能なドラッグ&ドロップ スクリプト

[quirksmode]のエントリーから、一見シンプルで地味な感じですが、ボックスをドラッグ&ドロップできる高性能なスクリプトを紹介します。

Drag and dropのキャプチャ

Drag and drop

ドラッグ&ドロップできるボックスにはpositionがfixed, absoluteの二種類があり、fixedはページをスクロールしてもブラウザの表示領域を基準に同じ位置に表示され、absoluteはページの左上を基準にして表示されます。

また、キーボードの操作でもボックスの移動が可能で、アクセシブルなスクリプトとなっています。

top of page

©2017 coliss