Was macht dieses Skript?

Dieses Skript erlaubt es, Webseiten-Elemente beliebig auf der Seite zu verschieben, indem man sie mit der Maus anklickt und an eine andere Stelle zieht.

Benutzung

Zuerst muss die JavaScript-Datei auf der Seite eingebunden werden, auf der es benutzt werden soll. Dazu kann folgender HTML-Schnipsel verwendet werden:
<script type="text/javascript" src="drag_element.js">
</script>
Dann muss ein onmousedown-EventHandler mit dem Element verknüpft werden, welches den Bewegungsprozess starten soll. Hier kann ein Objekt direkt als Parameter übergeben werden.
<div onmousedown="return lers_startMove(this)">
…
</div>
Alternativ kann auch eine Element-ID übergeben werden, wenn ein anderes Element verschoben werden soll als das, auf welches man soeben geklickt hat.
<h1 onmousedown="return lers_startMove('menu')">
…
</h1>

Bemerkungen

Demo
Skript-Datei herunterladen

Versionsgeschichte

v1.1

• Einschränkung entfernt, dass ein Element absolut positioniert sein muss
• Funktionen und globale Variablen gepräfixt, um die Wahrscheinlichkeit von Namenskollisionen mit anderen Skripten zu reduzieren
• eine weitere CSS-Klasse zum angeklickten Element hinzugefügt, sodass andere Styles (z.B. ein anderer Cursor) dafür gesetzt werden können

v1.0

• erste Veröffentlichung