◀ 2.

Drag and Drop API

▶

編集

ページの作成

テンプレートを更新

ページの作成

親となるページを選択してください。

ページは必ず何かしらの親ページに紐づきます。
親ページに紐づくページを子ページといいます。
例：親=スポーツ, 子1=サッカー, 子2=野球

子ページを親ページとして更に子ページを作成することも可能です。
例：親=サッカー, 子=サッカーのルール

親ページはいつでも変更することが可能なのでとりあえず作ってみましょう！

テンプレート

Drag and Drop API

HTML5ではHTML文にdraggable="true"を付けるだけで、ほぼすべての要素がドラッグ＆ドロップ可能になる。

例えば、img要素の場合は<img draggable="true">と記載する。

ドラッグする要素に使用するイベントと、ドロップを受け入れる要素に使用するイベントがある。

JavaScriptで記述し使用する。

dragstart	ドラッグ開始時
drag	ドラッグしている間
dragend	ドラッグ終了時
dragenter	ドラッグしている要素がエリアに入ったとき
dragover	ドラッグしている要素がエリアにある間
dragleave	ドラッグしている要素がエリアから出たとき
drop	ドラッグしている要素がドロップされたとき