js实现拖动的封装函数

标签：

function drag(obj,site,fn){
   var dmW = document.documentElement.clientWidth || document.body.clientWidth  
   var dmH = document.documentElement.clientHeight || document.body.clientHeight
   var site = site || {};               
   var adsorb = site.n || 0;              //磁性吸附的吸附范围
   var l = site.l || 0;
   var r = (site.r || site.r==0)?site.r:dmW - obj.offsetWidth;
   var t = site.t || 0;
   var b = (site.b || site.b==0)?site.b:dmH - obj.offsetHeight; 
   obj.onmousedown=function(ev){
      var oEvent = ev || event;
      var siteX = oEvent.clientX-obj.offsetLeft;
      var siteY = oEvent.clientY- obj.offsetTop;
      if(obj.setCapture){                  //兼容IE低版本的阻止默认行为，并实现事件捕获
         obj.onmousemove=move;
         obj.onmouseup=up;
         obj.setCapture();
      }else{
         document.onmousemove=move;
         document.onmouseup=up;
      }
      function move(ev){
         var oEvent = ev || event;
         var iLeft = oEvent.clientX - siteX;
         var iTop = oEvent.clientY - siteY;
         if(iLeft <=l+adsorb){              //限制拖动范围
            iLeft=0;
         }
         if(iLeft >=r-adsorb){
            iLeft= r;
         }
         if(iTop<=t+adsorb){
            iTop =0;
         }
         if(iTop >=b-adsorb){
            iTop = b;
         }
         if(fn){                         //执行回调函数，如果有其他附加情况需要处理
            fn({left:iLeft,top:iTop})
         }else{
            obj.style.left = iLeft + ‘px‘;
            obj.style.top = iTop + ‘px‘;
         }
      }
      function up(){
         this.onmousemove=null;
         this.onmouseup=null;
         if(obj.setCapture){            //拖放结束后释放捕获
            obj.releaseCapture();
         }
      }
      return false;
   }
   
   
}

js实现拖动的封装函数

标签：

原文地址：http://www.cnblogs.com/family-spring/p/5409208.html