Opened 21 months ago

Last modified 21 months ago

#12868 new bug

Fixed Position Draggable Element Scrolls Offscreen

Reported by: NMcCloud Owned by:
Priority: minor Milestone: none
Component: ui.draggable Version: 1.11.4
Keywords: Cc:
Blocked by: Blocking:

Description

If a fixed position element is made draggable, and that element is then moved beyond the scrollbar region, it will accelerate off screen. The only way this behavior does not occur is if the scroll is already at the top or bottom of the window. Its rather comical.

This used to work in 10.4, which I am trying to migrate from (i.e. it would simply push the element at a constant rate up or down)

<div id="a" style="width:50px;height:100px;position:fixed;top:300px;left:200px;background:red"></div> <div style="width:50px;height:5000px;position:absolute;background:blue"></div> <script> $("#a").draggable(); </script>

Change History (2)

comment:1 in reply to: ↑ description Changed 21 months ago by NMcCloud

Replying to NMcCloud:

If a fixed position element is made draggable, and that element is then moved beyond the scrollbar region, it will accelerate off screen. The only way this behavior does not occur is if the scroll is already at the top or bottom of the window. Its rather comical.

This used to work in 10.4, which I am trying to migrate from (i.e. it would simply push the element at a constant rate up or down)

<div id="a" style="width:50px;height:100px;position:fixed;top:300px;left:200px;background:red"></div> <div style="width:50px;height:5000px;position:absolute;background:blue"></div> <script> $("#a").draggable(); </script>

Here is the jsbin: http://jsbin.com/kuhebusixi/1/edit?html,output

Thanks,

Ken

comment:2 Changed 21 months ago by NMcCloud

I hacked the draggable widget (_mouseStart, and _mouseStop), turning off the scroll option if the element being dragged is either fixed or is in a fixed parent. Apparently, the scroll plugin is what is causing the element to accelerate off the screen when the mouse is pulled to the top or bottom of the screen.

See: http://jsbin.com/supuxekuqo/1/edit

Thanks,

Ken

Note: See TracTickets for help on using tickets.