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

What is Framer? Join the Community
Return to index
Blaine Billingsley
Posted Oct 09 - Read on Facebook

Hey Framerheads!

I am digging into Framer more and trying some stuff. I've been using draggable in place of scroll for a variety of reasons (mostly because there is no "whileScrolling" and there is a "DragMove"), and I'm trying to make this draggable layer have a similar momentum that it would with a scroll event.

I'm trying to figure out:

1. How to make the momentum slow as you get closer to the top or bottom of the scrolling element, the way it naturally would on scroll, or

2. How to "intercept" the animation if the momentum takes it way past the limit and animate back to it resting spot.

Here's my example project that's about halfway there:

https://dl.dropboxusercontent.com/u/12848031/ScrollThreshold.framer/index.html

And here's the zipped file: https://dl.dropboxusercontent.com/u/12848031/ScrollThreshold.framer.zip

Thanks in advance for any help and apologies for the goofiness of my code!

4 Comments

Blaine Billingsley

BTW, if there are easier ways to get around this problem by using the regular old Scroll method, I am fine with that too!

Arlo Jamrog

I'm guessing the third draggable in this example will help you figure it out. Basically you calculate a delta based on the distance the item is from its origin, and use that as the drag speed: http://examples.framerjs.com/#draggable-basics.framer

Min-Sang Choi

I think you can just use this example made by Koen. http://qcnoodling.com/ScrollViewBest.framer/

Blaine Billingsley

Min-Sang! Awesome! I had never seen this before. Perfect as usual! Thank you!

Read the entire post on Facebook