• バックアップ一覧
• 差分 を表示
• ソース を表示
• バックアップ を表示
• jQuery/UI_Draggable へ行く。

---

• 追加された行はこの色です。
• 削除された行はこの色です。

#author("2021-09-25T11:38:43+09:00;2021-09-25T11:37:52+09:00","default:inoue.ko","inoue.ko")
*jQuery UI Draggable
jQuery UI によるドラッガブルマップ
~

jQuery UI はインタラクティブなWebサイトを開発するために使用される、jQueryをベースにしたJavaScriptのライブラリで、Draggable 機能を用いると、地図画像をドラッグして動かすなど、要素に対するドラッグ機能が実現します。
-公式サイト：https://jqueryui.com/
~

-DEMO：https://koichi-inoue.github.io/JQ_Draggable/
-CODE：https://github.com/koichi-inoue/JQ_Draggable
~


***準備
-1）ファイルセットのダウンロード
https://jqueryui.com/　からDLして下さい。
必要なのは ''jquery-ui.min.js'' のみです。

-2） 構成ファイルの確認
--index.html （動作確認用）
--css（フォルダ）/　jquery-ui.min.css　''style.css''
--js （フォルダ）/　jquery-xxxxx.min.js　jquery-ui.min.js　''sample.js''
--images（フォルダ）/　''map.png　pinMarker.png''

-3) index.html、style.css,、sample.jsの３つについて、それぞれ以下のソースをコピー＆ペーストしてお試しください。

~
~

**APPENDIX
以下、マーカー上をホバーすると、地名の文字列を出力する事例です。上記のサンプルと基本的には同じです。

-DEMO：https://koichi-inoue.github.io/JQ_Draggable2/
-CODE：https://github.com/koichi-inoue/JQ_Draggable2

~
~
~