JavaScript achieves perfect drag and drop effect

The principle of dragging

1. Get the distance (mouse position - margin of odiv)

2. Understand when to use onmousemove event

3. Determine whether it is crossed

html code:

<div ></div>

css code:

#div1{width:100px;height:100px;background:red;position:absolute}

javascript code:

=function(){
  var oDiv=("div1");
  var x=0;
  var y=0;
  =function(ev){
    var oEvent=ev||event;
    //The horizontal coordinate of the mouse minus the offsetLeft of the div    x=;
    //The vertical coordinate of the mouse minus the div's offsetTop    y=; 
     
    =function(ev){
      var oEvent=ev||event;   
      var left=-x;
      var right=-y;
      //Judge whether the left side passes the boundary      if(left&lt;0){
        left=0;
      }
      //Judge whether the right side passes the boundary      else if(left&gt;){
        left=;
      }
      //Judge whether the above crosses the boundary      if(right&lt;0){
        right=0;
      }
      //Judge whether the following passes the boundary      else if(right&gt;){
        right=;
      }
      =left+"px";
      =right+"px";
    }   
    =function(){
      //Empty document event      =null;
      =null;
    }
    //Solve the low version of Firefox bug, kill the system by default    return false;
  }
}

The above is the entire content of this article, I hope you like it.