拖拽狀態(tài) = 0鼠標在元素上按下的時候{   
  拖拽狀態(tài) = 1   
  記錄下鼠標的x和y坐標   
  記錄下元素的x和y坐標   
  }  
 鼠標在元素上移動的時候{   
  如果拖拽狀態(tài)是0就什么也不做。   
  如果拖拽狀態(tài)是1，那么   
  元素y = 現(xiàn)在鼠標y - 原來鼠標y + 原來元素y   
  元素x = 現(xiàn)在鼠標x - 原來鼠標x + 原來元素x   
  }    
 鼠標在任何時候放開的時候{   
  拖拽狀態(tài) = 0   
} 

<div class="calculator" id="drag">**********</div> 

calculator { 
  position: absolute; /*設置絕對定位，脫離文檔流，便于拖拽*/ 
  display: block; 
  width: 218px; 
  height: 280px; 
  cursor: move;  /*鼠標呈拖拽狀*/ 
} 

window.onload = function() { 
  //拖拽功能(主要是觸發(fā)三個事件：onmousedown\onmousemove\onmouseup) 
  var drag = document.getElementById('drag'); 
  //點擊某物體時，用drag對象即可，move和up是全局區(qū)域，也就是整個文檔通用，應該使用document對象而不是drag對象(否則，采用drag對象時物體只能往右方或下方移動) 
  drag.onmousedown = function(e) { 
    var e = e || window.event; //兼容ie瀏覽器 
    var diffX = e.clientX - drag.offsetLeft; //鼠標點擊物體那一刻相對于物體左側邊框的距離=點擊時的位置相對于瀏覽器最左邊的距離-物體左邊框相對于瀏覽器最左邊的距離 
    var diffY = e.clientY - drag.offsetTop; 
    /*低版本ie bug:物體被拖出瀏覽器可是窗口外部時，還會出現(xiàn)滾動條， 
      解決方法是采用ie瀏覽器獨有的2個方法setCapture()\releaseCapture(),這兩個方法， 
      可以讓鼠標滑動到瀏覽器外部也可以捕獲到事件，而我們的bug就是當鼠標移出瀏覽器的時候， 
      限制超過的功能就失效了。用這個方法，即可解決這個問題。注：這兩個方法用于onmousedown和onmouseup中*/ 
      if(typeof drag.setCapture!='undefined'){ 
        drag.setCapture(); 
      } 
    document.onmousemove = function(e) { 
      var e = e || window.event; //兼容ie瀏覽器 
      var left=e.clientX-diffX; 
      var top=e.clientY-diffY; 
      //控制拖拽物體的范圍只能在瀏覽器視窗內，不允許出現(xiàn)滾動條 
      if(left<0){ 
        left=0; 
      }else if(left >window.innerWidth-drag.offsetWidth){ 
        left = window.innerWidth-drag.offsetWidth; 
      } 
      if(top<0){ 
        top=0; 
      }else if(top >window.innerHeight-drag.offsetHeight){ 
        top = window.innerHeight-drag.offsetHeight; 
      } 
      //移動時重新得到物體的距離，解決拖動時出現(xiàn)晃動的現(xiàn)象 
      drag.style.left = left+ 'px'; 
      drag.style.top = top + 'px'; 
    }; 
    document.onmouseup = function(e) { //當鼠標彈起來的時候不再移動 
      this.onmousemove = null; 
      this.onmouseup = null; //預防鼠標彈起來后還會循環(huán)（即預防鼠標放上去的時候還會移動） 
      //修復低版本ie bug 
      if(typeof drag.releaseCapture!='undefined'){ 
        drag.releaseCapture(); 
      } 
    }; 
  }; 
};