Drag’n'Drop using Javascript and DHTML
This is a quick tutorial explaining how to insert drag’n'drop events in our html code.
Thanks to Javascript and DHTML, you can write complex
web pages.
This piece must be put in the <head> section:
<script type="text/javascript">
var MouseDown;
var OffsetX;
var OffsetY;
var ie5=document.all&&document.getElementById;
function init(e) {
OffsetX = ie5 ? window.event.clientX : e.clientX;
OffsetY = ie5 ? window.event.clientY : e.clientY;
MouseDown = true;
}
function done(e) {
MouseDown = false;
}
function windowMove(e) {
if ((ie5 && MouseDown == true) ||
((e != null) && (MouseDown == true))) {
topX = parseInt (parent.document.
getElementById ("options").style.left);
topY = parseInt (parent.document.
getElementById ("options").style.top);
parent.document.getElementById ("options") .style.top =
(topY + (ie5 ? window.event.clientY : e.clientY) -
OffsetY) + "px";
parent.document.getElementById ("options").style.left =
(topX + (ie5 ? window.event.clientX : e.clientX) -
OffsetX) + "px";
}
}
</script>