この記事は機械翻訳のミラー記事です。元の記事にジャンプするにはこちらをクリックしてください。

Architect_Programmer_Code農業ネットワーク»建築家 › フロントエンド設計とウェブ › HTML/CSS/JavaScript › HTMLはdiv要素を任意のドラッグに設定します
眺める： 7184|答える： 2

[HTML/HTML5] HTMLはdiv要素を任意のドラッグに設定します

[リンクをコピー]
掲載地 2022/04/26 10:32:01 | | | |
要件:HTMLウェブページには、ユーザーが習慣に応じて目的の位置にドラッグできるツールバーがあります。

まず、レンダリングは以下の通りです:



HTML要素は、ドラッグ可能なプロパティをtrueに設定することで任意にドラッグできますが、マウスを離すと元の位置に戻ります。

マウスを離した後にその要素を移動させるドラッグイベントを追加することでこれを実現できます。

添付はソースコードです:

ドラッグターゲット(ソース要素)でイベントをトリガーする:

OndragStart - ユーザーが要素をドラッグし始めたときにトリガーされます
オンドラグ - エレメントがドラッグされているときにトリガーされます
Ondragend - ユーザーが要素のドラッグを終えたときにトリガーされます

対象が解放されたときに発生するイベント:

ondragenter - マウスがドラッグしたオブジェクトがそのコンテナのスコープに入るとこのイベントをトリガーします
ondragover - このイベントは、ドラッグされたオブジェクトが他のオブジェクトコンテナのスコープ内でドラッグされたときにトリガーされます
ondragleave - このイベントは、マウスがドラッグしたオブジェクトがコンテナの範囲外に出たときにトリガーされます
オンドロップ - ドラッグ中にマウスキーを離したときにこのイベントが発生します

参考：

HTML5のドラッグ&ドロップAPIを使おう
https://www.itsvse.com/thread-10299-1-1.html




先の：HTML5のドラッグ&ドロップAPIを使おう
次に：角度成分はnbsp空間を返します。

関連記事
掲載地 2022/04/26 21:24:22 |
もう一度学びに来て
掲載地 2022/04/27 14:13:06 |
学べ、学べ
免責事項：
Code Farmer Networkが発行するすべてのソフトウェア、プログラミング資料、記事は学習および研究目的のみを目的としています。 上記の内容は商業的または違法な目的で使用されてはならず、そうでなければ利用者はすべての結果を負うことになります。 このサイトの情報はインターネットからのものであり、著作権紛争はこのサイトとは関係ありません。 ダウンロード後24時間以内に上記の内容を完全にパソコンから削除してください。 もしこのプログラムを気に入ったら、正規のソフトウェアを支持し、登録を購入し、より良い本物のサービスを受けてください。 もし侵害があれば、メールでご連絡ください。
Mail To:help@itsvse.com