Previously on the Internet to see the simplest drag object code, forget what the author called.
The original code in IE some small problems, and declared that the document type is XHTML 1.0, in the FF and other non-IE browser invalid, it has been improved, is now compatible: IE, Firefox, Opera ...
The following code is just a demonstration of the principle, specific application please combine your own actual needs to modify.
<!doctype HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "http://www.w3.org/TR/xhtml1/DTD/ Xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "lang=" gb2312 "> <pead> <title > Code Example: Drag Objects Drag Object (compatible: IE, Firefox, Opera ...) </title> <meta http-equiv= "Content-type" content= "text/html; charset=gb2312 "/> <meta name=" editor "content=" Maple Rock, http://www.cnlei.com "> <meta name=" keywords "content=" Code instance: Drag the Object "> <meta name=" description "content=" The shortest Drag object code instance demo "> <style>. dragable {position:relative; Cursor:move;} </style> <script language= "JavaScript" > <!--//author:unkonw/Modify: Maple @cnlei.com var ie=docume Nt.all; var nn6=document.getelementbyid&&!document.all; var Isdrag=false; var y,x; var odragobj; function Movemouse (e) {if (Isdrag) {oDragObj.style.top = (nn6? nty + e.clienty-y: Nty + event.clienty-y) + px "; ODragObj.style.left = (nn6? NTX + E.clientx -X:ntx + event.clientx-x) + "px"; return false; } function Initdrag (e) {var odraghandle = nn6? e.target:event.srcelement; var topelement = "HTML"; while (Odraghandle.tagname!= topelement && odraghandle.classname!= "dragable") {Odraghandle = nn6? odraghand Le.parentNode:oDragHandle.parentElement; } if (odraghandle.classname== "dragable") {Isdrag = true; Odragobj = Odraghandle; Nty = parseint (odragobj.style.top+0); y = nn6? E.clienty:event.clienty; NTX = parseint (odragobj.style.left+0); x = nn6? E.clientx:event.clientx; Document.onmousemove=movemouse; return false; }} Document.onmousedown=initdrag; Document.onmouseup=new Function ("Isdrag=false"); --> </script> </pead> <body> <div class= "Dragable" > These are all drag objects </div> </b Ody> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]