Sortablejs auto-scroll speed according to distance from edge

1.8k views Asked by At

The auto-scroll of sortablejs feels like it barely works. Sometimes it lags. I'm working on an app that needs a smooth scroll similar to how it works in react-beautiful-dnd. It starts scrolling slowly when you go close to the edge and it speeds up as you go even closer to the edge. It feels so natural.

Here's how we want it to work and then how sortablejs currently works

react-beautiful-dnd

react-beautiful-dnd-scroll

sortablejs

sortablejs-scroll

I moved from react-beautiful-dnd to sortablejs because it doesn't support a tree-like nested list. But the auto-scroll of sortablejs just isn't something we can deploy to users because it feels so buggy that it feels like it barely works and it makes the whole UX looks so bad. So I'm literally stuck like many users of sortablejs who submitted issues regarding the auto-scroll.

If you know how to achieve this or know a different library that has both good scroll and nested/tree-like structure support please do suggest.

here's a clean and simple codesandbox to test the scroll

https://codesandbox.io/s/vanilla-sortablejs-scroll-test-fmch4

1

There are 1 answers

0
daniil sidorov On

you need to add forceFallback: true in the config. After that, the scrollSensitivity will start working.