拖拽封装（碰撞检测+磁性吸附）

(function(w){
    w.lufei={};
    damu.drag= function (node,flag,value,node2){
        //node:拖拽元素
        //flag：是否限制范围
        //value：吸附程度
        //node2：碰撞元素
        var limit = true;
        var adsorption =0;
        var startPoint = {x:0,y:0};
        var mouseDownPoint ={x:0,y:0}
        node.onmousedown=function(ev){
            ev= ev||event;
            startPoint.x = this.offsetLeft;
            startPoint.y = this.offsetTop;
            mouseDownPoint.x=ev.clientX;
            mouseDownPoint.y=ev.clientY;
            if(this.setCapture){
                this.setCapture();
            }
            document.onmousemove=function(ev){
                ev= ev||event;
                var mouseMovePoint ={x:0,y:0}
                mouseMovePoint.x=ev.clientX;
                mouseMovePoint.y=ev.clientY;
                var dis={x:0,y:0};
                dis.x = mouseMovePoint.x - mouseDownPoint.x;
                dis.y = mouseMovePoint.y - mouseDownPoint.y;
                var L = startPoint.x + dis.x;
                var T = startPoint.y + dis.y;
                
                // 磁性吸附
                limit = flag===false?false:true;
                if(limit){
                    if(value){
                        adsorption = value;
                    }
                    
                    if(L<adsorption){
                        L=0;
                    }else if(L>(document.documentElement.clientWidth- node.offsetWidth -adsorption)){
                        L=(document.documentElement.clientWidth- node.offsetWidth)
                    }
                    if(T<adsorption){
                        T=0;
                    }else if(T>(document.documentElement.clientHeight - node.offsetHeight -adsorption)){
                        T=(document.documentElement.clientHeight - node.offsetHeight)
                    }
                }
                
                
                
                
                node.style.left = L +"px";
                node.style.top =  T+"px";
                // 碰撞检测
                if(node2){
                    var T1 = node.offsetTop;
                    var B1 = node.offsetTop + node.offsetHeight;
                    var R1 = node.offsetLeft + node.offsetWidth
                    var L1 = node.offsetLeft;
                    
                    var T2 = node2.offsetTop;
                    var B2 = node2.offsetTop + node2.offsetHeight;
                    var R2 = node2.offsetLeft + node2.offsetWidth
                    var L2 = node2.offsetLeft;
                    if(R1<L2||B1<T2||L1>R2||T1>B2){
                        node2.src="img/tg.png";
                    }else{
                        node2.src="img/xfz.png";
                    }
                }
            }
            
            document.onmouseup=function(){
                document.onmousemove = document.onmouseup = null;
                if(document.releaseCapture){
                    document.releaseCapture();
                }
            }
            return false;
        }
    }
})(window)