背景の画像をD&D出来る様にする、というスクリプトのご紹介です。jQuery依存になります。ECサイト等で使えるかも・・・しれない。

用途はちょっと限定されそうですけど面白かったのでメモ。軽量で使い方も簡単です。

Draggable Background

動作デモです。

テキストは普通にボックス内に書いてるだけ。背景はCSSで指定しています。あとはD&D出来る様に設定するだけ。

<script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js'></script>
<script src="draggable_background.js"></script>

本体とプラグインを読み込み。

$('div').backgroundDraggable();

あとはセレクタを指定するだけ。

X軸のみ、Y軸のみの指定も可能です。ただ、セミコロンがほとんど抜けてるので修正しないとかも。ライセンスはMITとの事です。

Draggable Background