Create your own drag & drop function

It seems that my attempt to try to reproduce the JQuery UI draggable function proved the principle of quantum mechanics div, existing in two places at the same time.

When I hold the mouse pointer over the div box and move the mouse cursor, the div box starts blinking like crazy, and the clone of the div window appears southeast of the original div rectangle, and it also blinks.

Here's the jsfiddle:

jsfiddle

+5
source share
2 answers

I fixed your jsfiddle, let it go now: http://jsfiddle.net/5Sxrq/2/

The problems were:

margin-top:100px;
margin-left:80px;

if you want to use fields you have to subtract it from offsets

boxOff = $('#box').offset();
mouseOffX = e.pageX - boxOff.left;
mouseOffY = e.pageY - boxOff.top;

mouseOffX mouseOffY, mousedown, mousemove

EDIT: : http://jsfiddle.net/5Sxrq/3/

+7

, , , . mouseOffX mouseOffY onmousedown, .

. , : http://jsfiddle.net/RzqQE/

, - .

: , . , : http://jsfiddle.net/7QzZM/

, , :

. , , . , (dx dy ). , .

, $('#box').position() $('#box').offset(); , .

+5

All Articles