指定した要素をドラッグして移動「tinyDraggable」
当ページのリンクには広告が含まれています。
スポンサーリンク
指定した要素をドラッグして移動できるようにするプラグイン「tinyDraggable」を紹介します。
jQueryプラグイン「tinyDraggable」
このプラグインを使えば、指定した要素をマウスを使ってドラッグし、お好きな位置まで移動することができます。
要素を指定するだけなので、テーブルなんかもドラッグすることができます。
スポンサーリンク
それではデモページの要素をドラッグしてみてください。
ソース( HTML + jQuery )
<!DOCTYPE html> <html> <head> <meta charset='utf-8'> <meta name="description" content="tinyDraggable のデモでーす。"> <title>tinyDraggable - jQueryプラグイン</title> <style> #demo1 { border: blue solid 1px; width: 300px; height: 250px; } </style> </head> <body> <h1>tinyDraggable のデモでーす。</h1> <p> <div id="demo1">ドラッグしてみてください。</div> <table id="demo2" border="1"> <tr><td>テーブル</td><td>もドラッグ</td></tr> <tr><td>できるよ</td><td>。</td></tr> </table> <script src="https://code.jquery.com/jquery-1.11.1.min.js"></script> <script src="jquery.tiny-draggable.js"></script> <script> $('#demo1').tinyDraggable(); $('#demo2').tinyDraggable(); </script> </body> </html>
スポンサーリンク