This is a read-only archive of the Framer Community on Facebook.

What is Framer? Join the Community
Return to index
Robin Spielmann
Posted Nov 23 - Read on Facebook

Hello,
I'm trying to build a scrollable list with draggable list items. Inside my scroll component are list layers listening to a dragStart, dragMove and DragEnd event. When I want to scroll on the list items I also trigger the DragStart event. Is there a way to differentiate this two separate events? Or maybe building something like a short delay to trigger the drag event?
Any ideas? Thanks!

3 Comments

Eelco Lempsink

Hi Robin, here’s a small example based on the ‘Scroll List’ snippet that has draggable layers inside a scroll component, but prevents dragging both at the same time: http://share.framerjs.com/ofe9gpq5ercx/
I’ve added some (commented out) print statements that might help make it more clear what happens. Also note I’m using lodash’s invokeMap (https://lodash.com/docs/#invokeMap) to keep the code short, but it’s simply looping over all the items in the list.

Robin Spielmann

Thanks Eelco! This example is extremely helpful. However, my list items are vertical draggable (to sort the items) and the scroll component is vertical as well. Am I right that this method can't handle this differentiation?

Christie Gettler Tarazon

Andrea Pedrina did you see this article?

Read the entire post on Facebook