JavaScript implementation draggable DIV layer

The original Published time: 2009-05-04--from my Baidu article [imported by moving tools]

Note that the following red sections are key. If you do not use document.documentelement, and you use Document.body, there will be a problem with FF, if you do not use background:red; Style, it appears in IE and can only be dragged when the mouse is placed on a div border.

var offset_x;
var offset_y;
function Milan_startmove (oevent)
{
var Whichbutton;
if (document.all&&oevent.button==1) whichbutton=true;
else {if (oevent.button==0) whichbutton=true;}
if (Whichbutton)
{
var Odiv=document.getelementbyid ("Odiv");
Offset_x=parseint (Oevent.clientx-odiv.offsetleft);
Offset_y=parseint (Oevent.clienty-odiv.offsettop);
Document.documentelement.onmousemove=function (mevent)
{
var eevent;
if (document.all) eevent=event;
Else{eevent=mevent;}
var Odiv=document.getelementbyid ("Odiv");
var x=eevent.clientx-offset_x;
var y=eevent.clienty-offset_y;
odiv.style.left= (x) + "px";
odiv.style.top= (y) + "px";
}
}
}
function Milan_stopmove (oevent) {document.documentelement.onmousemove=null;}

<div id= "Odiv" onmousedown= "Milan_startmove (event)" onmouseup= "Milan_stopmove (event)" style= "cursor:move; POSITION:ABSOLUTE;WIDTH:100PX;HEIGHT:60PX;BORDER:1PX Solid Silver;left:100px;top:100px;background:white;z-index : 9999; " >
</div>

The above is a solution for cross-IE6 and FF browsers, and after clearing up the idea, it is quite simple to do.

Note: Problems moving outside the page will occur ...

JavaScript implementation draggable DIV layer