First let's analyze the steps of towing, first of course, it is your mouse to press the layer to be dragged, then things, you can imagine: it is a mouse
. Finally, drag to the destination, the mouse button is released, dragging the end.
If you read the event driver of this site, you must know that the mouse is triggered by the mousedown event, the event that the mouse is released is Mouseup, and the event drive is implemented.
The method of the function function is obj.οnmοusedοwn = func; canceled method is obj.οnmοusedοwn = null; ok, I know the above knowledge, let us take a look
code:
VAR OFFY;
Var offx; // offy, OFFX saves the relative coordinates of the mouse prescribed in the drag object
Function DRAG () {
ALLL.Style.top = Event.Clienty Document. Body.scrolltop-offy;
Alll.Style.Left = event.clientX document. Body.scrollLeft-offx;
Return True;
} // Mouse follow-up function
Function start_drag () {
OFFY = Event.offsety;
OFFX = event.offsetx;
Document. οnmοusemοve = DRAG;
} // Start drag (make the mouse to be effective)
Function stop_drag () {
Document. οnmοusemοve = NULL;
} // Stop dragging (so that the mouse is followed)
script>
οnmοuseοut = "stop_drag ()"> This layer can be dragged yeah! div>
Note: When the mouse is pressed, the mouse is stopped or left when the mouse is released, and the ONMOUSEOUT is because sometimes ONMOUSEUP is not very good.