Open brietsparks opened 6 years ago
Have this problem on Edge browser on windows mobile (but not on chrome dev tools emulator). Unfortunately this is the only physical device I have at the moment so haven't tested on android or iOS.
The container scrolls when dragging but stops when entering the top or bottom autoscroll regions, or if the drag is paused, ie. stop moving finger while maintaining touch, then move again
Jitter - when the drag is started in the auto-scroll regions the dragged element animation lags causing it to jump. Smooth when started outside the auto-scroll regions, i.e. the middle part of the screen.
brietsparks: This hack stops the unwanted scrolling but doesn't fix jitter - put it in onDragStart function
this.containerRef.scrollTop = this.containerRef.scrollTop - 1;
// will not scroll up 1px if scrollTop is zero =>
// do not scroll it down to avoid page moving
if (this.containerRef.scrollTop > 0)
this.containerRef.scrollTop = this.containerRef.scrollTop + 1;
kutlugsahin: fyi had same problem with react-beautiful-dnd too!
In mobile, when dragging an item, the window scrolls before the item reaches the edge of the screen, and the elements jitter.
Example: https://github.com/brietsparks/rsd
This happens when using the library, but not in the demo app.