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

What is Framer? Join the Community
Return to index
Ben Rodenhäuser
Posted Mar 15 - Read on Facebook

Hi everyone.

I have a page component containing various layers (i.e. pages), some of them wrapped in scroll components. What I want to achieve is that clicking on the right half of the prototype snaps to the next page (to the right), while clicking on the left half snaps to the previous page (to the left). What I do to achieve this is add two transparent "dummy layers" on top of my page component (one in the left half, the other in the right half), and on these layers, I register the clicks and let the page component snap further.

Now all of this works fine. But the fact that I now have transparent layers on top of my scroll components makes it so that these won't scroll anymore. Clearly, the dummy layers block my scrolling attempts from registering with the scroll component. How could I fix this? Is my approach with the dummy layers the wrong one?

5 Comments

Jonas Treub
Ben Rodenhäuser

Thanks, Jonas. My setup is a bit the opposite: I have a page component which fills the whole screen, and some of the pages in it are actually scroll components. I don't have any obvious click targets on the screen to distinguish between "go left" clicks and "go right" clicks, which is why I came up with these dummy layers. Unfortunately, I cannot share the prototype. But perhaps I should try and extract my issue from the prototype to explain myself better.

Ben Rodenhäuser

Hey Jonas, here is a prototype which shows my problem ... http://share.framerjs.com/0poc182fij4f/

Jonas Treub

The layers with the click handlers indeed blocked all interaction. Here I added a single click handler on the slides layer and check whether the x position is near the edge. http://share.framerjs.com/7pcn4s40vpdj/

Ben Rodenhäuser

Ahh, wonderful. Thanks so much!

Read the entire post on Facebook