Anforderungen: HTML-Webseiten verfügen über eine Symbolleiste, mit der Nutzer entsprechend ihren Gewohnheiten an die gewünschte Position ziehen können.
Zunächst sind die Darstellungen wie folgt:
HTML-Elemente können beliebig gezogen werden, indem die draggable Eigenschaft auf true gesetzt wird, aber das Element kehrt an seine ursprüngliche Position zurück, wenn die Maus losgelassen wird.
Das kannst du tun, indem du ein Dragend-Event hinzufügst, um das Element nach dem Loslassen der Maus in die Position zu verschieben.
Angehängt ist der Quellcode:
Lösen Sie ein Ereignis auf einem Drag-Ziel (Quellelement) aus:
ondragstart – ausgelöst, wenn der Benutzer beginnt, ein Element zu ziehen Ondrag – wird ausgelöst, wenn das Element gezogen wird ondragend – ausgelöst, wenn der Benutzer das Element gezogen hat
Ereignisse, die ausgelöst werden, wenn das Ziel freigegeben wird:
ondragenter – Löst dieses Ereignis aus, wenn ein von der Maus gezogenes Objekt in den Umfang seines Containers eintritt ondragover – Dieses Ereignis wird ausgelöst, wenn ein gezogenes Objekt innerhalb des Anwendungsbereichs eines anderen Objektcontainers gezogen wird ondragleave – Dieses Ereignis wird ausgelöst, wenn ein von der Maus gezogenes Objekt den Bereich seines Containers verlässt ondrop – Dieses Ereignis wird ausgelöst, wenn die Maustasten während eines Ziehens losgelassen werden
Referenz:
|