Code:
function drag (t,p) {var point = p | | | null, TARGET = T | | null, RESULTX = 0, resulty = 0; (!point)? Point = target: ';
If there is no drag point, the drag point defaults to the entire drag element function GetPos (t) {var offsetleft = 0, offsettop = 0, offsetparent = t;
while (offsetparent) {offsetleft+=offsetparent.offsetleft;
Offsettop+=offsetparent.offsettop;
offsetparent = offsetparent.offsetparent;
return {"Top": offsettop, ' Left ': offsetleft}; function core () {var width = Document.body.clientWidth | | document.documentElement.clientWidth, height = d Ocument.body.clientHeight | |
Document.documentElement.clientHeight;
MaxWidth = width-target.offsetwidth, maxheight = height-target.offsetheight; (Resultx >= maxwidth)? Target.style.left = maxwidth+ ' px ': (Resultx > 0)? target.style.left = Resultx + ' px ': ';
Resets the default location. (Resulty >= maxheight)? Target.style.top = maxheight + ' px ': (resulty > 0)? target.style.top = Resulty + ' px ': ';
Resets the default location.
Point.onmousedown=function (e) {var e = e | | window.event, COORDX = e.clientx, Coordy = E.clienty,
POSX = GetPos (target). Left, Posy = GetPos (target). Point.setcapture && point.setcapture ();
Locks the mouse event onto the specified element. Document.onmousemove=function (e) {var ev = e | | window.event, MoveX = ev.clientx, Movey = ev.
ClientY; Resultx = MoveX-(COORDX-POSX);
The result value is the coordinate point minus the drag element's margin resulty = Movey-(coordy-posy) from the left side of the browser; (Resultx > 0)? ((Resultx < maxwidth)? target.style.left = resultx+ ' px ': target.style.left = maxwidth+ ' px '): target.style.left = ' 0px '
; (resulty > 0)?
((Resulty < maxheight)? target.style.top = resulty+ ' px ': target.style.top = maxheight+ ' px '): target.style.top = ' 0px ';
Ev.stoppropagation && ev.stoppropagation ();
Ev.preventdefault;
Ev.returnvalue = false; Ev.cancelbubble = true;
};
};
Document.onmouseup=function () {//when resolving a drag, the onmousedown bug of the drag point cannot be triggered when the pointer to the DOM object is not a drag point element.
Document.onmousemove = null; Point.releasecapture && point.releasecapture ();
Removes the mouse event from the specified element.
};
Point.onmouseup=function (e) {var e = e | | window.event;
Document.onmousemove = null;
Point.releasecapture && point.releasecapture ();
};
Core ();
Window.onresize = core;
}
How to use:
Drag (t,p)
/* Description
* t means the dragged element
* p means the drag point
//
Note: If you omit the drag point, the default drag area is the entire dragged element