Drag

I jus did some experiment to get the drag drop func of elements and finally below is the code i could get working; The element gets draged on mouse over.

there are a few issues.. say when u make a quick drag and the mouse goes out .. i.e.. the element is not attached to the mouse evet. Ok the blogger isnt allowing me to put the HTML code. I m putting the css + js. Just include the div with id called draggableId in ur html nd things should work.

var origX;
var origY;
var flag=false;
function drag(){
var evt=window.event;
var v1 =evt.clientX + document.body.scrollLeft - document.body.clientLeft;
var v2 =evt.clientY + document.body.scrollTop - document.body.clientTop;
if(!flag){
flag=true;
origX=v1;
origY=v2 - 10 ;
}
var deltaX=v1-origX;
var deltaY=v2-origY;
var divEle = document.getElementById('dragableId');
//alert('>>' + divEle.offsetLeft);
divEle.style.left = divEle.offsetLeft + deltaX;
divEle.style.top = divEle.offsetTop + deltaY;
origX=v1;
origY=v2;
}

div.dragable{
position:absolute;
background:yellow;
right:500px;
top:300px;
padding:20px;
}

[div id='dragableId' class='dragable' onmousedown='drag();' onmousemove='drag()' ]
This is dragable
[/div]

A more nices + complicated impl is at: http://www.brainjar.com/dhtml/drag/