motion icon indicating copy to clipboard operation
motion copied to clipboard

[BUG] Scrolling while dragging elements causes the element to detach from the cursor.

Open jschneider33 opened this issue 3 years ago • 1 comments

1. Read the FAQs 👇

2. Describe the bug Scrolling while dragging elements causes the element to detach from the cursor. layoutScroll is on the scrollable element. I've seen several issues about related items, but none have quite solved this problem. Building a drag and drop component so a reorder list won't suffice. Not sure if I'm just missing something obvious or what. Thanks!

3. IMPORTANT: Provide a CodeSandbox reproduction of the bug https://codesandbox.io/s/framer-motion-2-layout-animations-forked-vzc643

4. Steps to reproduce

Steps to reproduce the behavior:

  1. Go to codesandbox
  2. click and hold on number element within the scrollable container to start dragging
  3. While dragging, scroll around. Element moves with scroll but cursor doesn't

5. Expected behavior During scroll, the dragged element counteracts the scrolling and stays attached to the cursor.

7. Environment details Chrome, MacOS 12.3

jschneider33 avatar Sep 09 '22 22:09 jschneider33

Even visible in the example at https://motion.dev/docs/react-reorder#scrollable-lists.