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

What is Framer? Join the Community
Return to index
Lee Jungyoung
Posted Sep 04 - Read on Facebook

When using PageComponent inside of ScrollComponent, both of them are reacting to cursor's move. So I put some code for fixing that more proper way. I used scroll.velocity to catch whether this move is 'scrolling' or 'paging' at the first frame.

Second PageComponent in the video is my version. Check and let me know how you think !

http://share.framerjs.com/ukdu1c6kmoad/

10 Comments

Lee Jungyoung

This is the code for that. Not sure this is just only way to solve this issue.

Jordan Robert Dobson

I think there is lockDirection have you looked at that?

Lee Jungyoung

Jordan Robert Dobson :( Oh my... I think directionLock is solution. I thought that wouldn't work for nested scrolls but it works well! Thanks again.

Jordan Robert Dobson

Jordan Robert Dobson

Awesome. I've spent tons of time figuring things out like this to find many solutions are already available in the docs. It doesn't hurt to roll your own version. That's how you learn.

Antonio Krämer Fernandez

I have a PageComponent within a ScrollComponent, pretty similiar to your example Lee Jungyoung. I can't figure out how to use draggable.directionLock in that case… the example in the docs shows it in case for a draggable layer, but how did you use it in your scroll/page case? Could you share your prototype with directionlock? btw your functions works like a charm ;)

Giovanni Caruso

I have 4 scrollComponents (horizontal) within a main ScrollComponent (vertical). I've used if / else to control which layer had to scroll. Don't know this could be of help...

Koen Bok

Yeah it's tough for discoverability of features when there is a ton of stuff you can do. Maybe we should start posting some random protips in here.

Lee Jungyoung

@Antonio, its super simple like this.

Joon Won Lee

Genius !

Read the entire post on Facebook