<p> 要素をドラッグしているときに JavaScript を実行します:
<p draggable="true" ondrag="myFunction(event)">Drag me!</p>
Try it Yourself ❯
ondrag 属性は、要素やテキスト選択をドラッグしているとき発火します。
ドラッグ&ドロップは、HTML5 では非常に一般的な機能です。それは、オブジェクトを「つかんで」、別の場所にドラッグすることです。 詳細については、HTML5 チュートリアルの HTML5 ドラッグ&ドロップ を参照してください。
注: 要素をドラッグできるようにするには、 グローバル HTML5 draggable 属性を使用します。
チップ: リンクや画像は、デフォルトでドラッグ可能であり、draggable 属性の必要はありません。
ドラッグ&ドロップ操作のいろいろな段階で、使用されたり、発生する可能性がある多くの event 属性があります:
注: 要素をドラッグている間、ondrag イベントは 350 ミリ秒おきに発火します。
表中の数字は、完全にイベント属性をサポートした最初のブラウザのバージョンを指定しています。
イベント属性 | |||||
---|---|---|---|---|---|
ondrag | 4.0 | 9.0 | 3.5 | 6.0 | 12.0 |
ondrag 属性は、HTML5 で新しく追加されました。
<element ondrag="script">
値 | 説明 |
---|---|
script | script は ondrag で実行される |
サポートする HTML タグ: | ALL HTML elements |
---|
HTML チュートリアル:HTML5 ドラッグ&ドロップ
HTML Reference: HTML draggable Attribute
HTML DOM リファレンス:ondrag イベント