SortableJS / Sortable

Reorderable drag-and-drop lists for modern browsers and touch devices. No jQuery or framework required.
https://sortablejs.github.io/Sortable/
MIT License
29.45k stars 3.7k forks source link

Scrolling does not work with fixed nav bars. #1240

Open Webifi opened 6 years ago

Webifi commented 6 years ago

Issue: Scrolling does not work with fixed nav bars. Affects (latest stable Windows releases of at time of report) Firefox (57.0.2), Chrome (63.0.3239.84), Edge (40.15063.674.0), IE 11.

Reproduction: See: http://jsbin.com/fuwafasefe/1/edit Drag item down to bottom, where there is no fixed element, allows window to scroll. Once window has scrolled down, dragging item up, where there is a fixed nav bar, does not allow window to scroll.

Same as closed issue #400

prefixaut commented 6 years ago

Also just noticed this Issue. I use it with Electron (Chrome only therefore) and a sticky footer. However, it's only activating the scrolling when it's hitting the top/bottom of the window rather than the end of the visible container.

Got around so far by just setting the scrollSensitivity bigger than the footer-height, but it's not a very clean and responsive solution.

Webifi commented 6 years ago

This still seems to be an issue in the latest version (1.7.0)

DrMartinGonzo commented 6 years ago

I had the same problem, I fixed it by setting pointer-events: noneon the fixed element when starting reordering.

aried3r commented 3 years ago

We also faced the same problem. Our solution was to switch the previously position: fixed; header to a position: sticky; top: 0; one. Some things had to be adapted, but luckily we are now at a point where all our supported browsers support sticky elements.

Users still have to scroll to the top end of the window, but our header is narrow enough to make it discoverable.