Draggable: distance between element and cursor increases when vertically scrolling during drag

[cattz]

Hi,

This problem is appeared since the v1.8 (no problem in 1.7 versions). When I move my draggable element outside the visible page (when the page scroll -> scroll:'true'), the draggable element doesnt appear beside my cursor but x pixels on top or bottom of my cursor. This phenomenon only occurs during a vertical autoscroll, not with horizontal autoscroll.

My code :

$(id_class_html).draggable( {handle : '.drg', revert:true, scroll:true, scrollSensitivity : 10, zIndex : 100, containment : 'document', revertDuration : 0, scrollSpeed : 45, opacity: 0.80, cursor: 'move', drag : function(event, ui) {...} });

Thanks Cattz

[clinisbut]

Same problem here. The position of the element being dragged seems to be incremented as you scroll.

However, I've found that if the element has position:absolute this does not occur. You can try it here: ​http://jsfiddle.net/hMdZj/ Try to drag the box down to no-visible areas. If you remove the position:absolute the bug appears.

[mikesherov]

confirmed on latest: ​http://jsfiddle.net/9xrf4/

simply drag the draggable to the edge of the window, and as the page scrolls to accomodate, notice it moves away from the cursor

[mikesherov]

#7278 is a duplicate of this ticket.

[mikesherov]

#7983 is a duplicate of this ticket.

[mikesherov]

#8073 is a duplicate of this ticket.

[mikesherov]

#5039 is related

[dhmitchell]

I've hacked a solution but I'm not sure of the root cause nor why the solution (which is trivial) wouldn't always be the right thing to do: in draggable.js: _mouseDrag (L 205), compute this.helper[0].style.top = (event.pageY - this.originalPageY) +"px"

My observation is that pageY was changing much less rapidly than scrollTop() although they should have changed at exactly the same rate afaik. I actually believe pageY was wrong, but it's where the mouse is and subsequent events are reported by the mouse's posit; so, it's where the helper should be. Given this, I'm not sure there's a reason to call _generatePosition nor _convertPositionTo and that the helper's top and left could be simple computations of (original)page(X|Y).

if this fix seems sound, I'm happy to do the official process.

[tj.vantoll]

Replying to dhmitchell:

I've hacked a solution but I'm not sure of the root cause nor why the solution (which is trivial) wouldn't always be the right thing to do: in draggable.js: _mouseDrag (L 205), compute this.helper[0].style.top = (event.pageY - this.originalPageY) +"px"

My observation is that pageY was changing much less rapidly than scrollTop() although they should have changed at exactly the same rate afaik. I actually believe pageY was wrong, but it's where the mouse is and subsequent events are reported by the mouse's posit; so, it's where the helper should be. Given this, I'm not sure there's a reason to call _generatePosition nor _convertPositionTo and that the helper's top and left could be simple computations of (original)page(X|Y).

if this fix seems sound, I'm happy to do the official process.

I believe that the code there is specifically for dealing with helpers (​http://api.jqueryui.com/draggable/#option-helper). In general though if you can come up with a fix feel free to send a pull request. Keep in mind that we'll want tests along with the fix.

Thanks.

[mikesherov]

Duplicate of #6817.