最简洁的js鼠标拖曳效果【原】

<! DOCTYPE html >
< html >
< head >
     < meta  http-equiv ="Content-Type"  content ="text/html; charset=utf-8"   />
     < meta  http-equiv ="Content-Language"  content ="zh-cn"   />
     < meta  http-equiv ="X-UA-Compatible"  content ="IE=EmulateIE7"   />
     < title > DragDrop </ title >
     < meta  name ="author"  content ="flowerszhong" >
     < meta  name ="date"  content ="" >
     < link  href =""  rel ="stylesheet"  type ="text/css"   />
     <!-- [if IE]>
      <script type='text/javascript' src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
  <![endif] -->
     <!--  <script src="http://code.jquery.com/jquery-latest.js"></script>  -->
     < style  type ="text/css" >
        .redBorderBox
         {
            border :  2px solid red ;
            position :  absolute ;
            width :  60px ;
            height :  60px ;
            cursor :  move ;
            background-color :  Red ;
         }
     </ style >
</ head >
< body >
     < div  id ="hd" >
     </ div >
     < div  id ="bd" >
         < div  class ="redBorderBox"  id ="dragObj1" >
            i am not dragObj </ div >
         < div  class ="redBorderBox dragObj"  id ="dragObj2"  style ="top: 90px; left: 90px;" >
            u can drag me </ div >
     </ div >
     < div  id ="ft" >
     </ div >
</ body >

< script >
     /*  鼠标拖动  */
    ( function () {
         var  oDrag  =   "" ;
         var  ox, oy, nx, ny, dy, dx;
         function  drag(e) {
             var  e  =  e  ?  e : event;
            oDrag  =  e.target  ?  e.target : e.srcElement;
             if  (oDrag.className.indexOf( " dragObj " )  ==   - 1 ) { oDrag  =   "" }
            ox  =  e.clientX;
            oy  =  e.clientY;
        }
         function  dragPro(e) {
             if  (oDrag  !=   "" ) {
                 var  e  =  e  ?  e : event;
                dx  =  parseInt(oDrag.style.left);
                dy  =  parseInt(oDrag.style.top);
                nx  =  e.clientX;
                ny  =  e.clientY;
                oDrag.style.left  =  (dx  +  (nx  -  ox))  +   " px " ;
                oDrag.style.top  =  (dy  +  (ny  -  oy))  +   " px " ;
                ox  =  nx;
                oy  =  ny;
            }
        }
        document.onmousedown  =   function (e) { drag(e); }
        document.onmouseup  =   function () { oDrag  =   "" ; }
        document.onmousemove  =   function (event) { dragPro(event); }
    })();
</ script >

</ html >