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

What is Framer? Join the Community
Return to index
Jangala Nikhileswar
Posted Jan 07 - Read on Facebook

Trying to recreate a card expansion/ collapse interaction but when multiple cards expand, the bottom cards are being clipped. Have tried to scroll.updateContent() and it is still not working. Can any one guide me on this!

Here is the Framer link


Ian McClure

For some reason the project was saying that it was using a newer version of Framer than I have.
Anyways, I copied the code, did some stuff, and made a few comments.

Edit: here is the link to my project.

Jangala Nikhileswar

Thank you so much Ian! :)
One doubt: Why do we need to add 220px to scroll.content.height instead of just using scroll.updateContent? Framer Doc's says it Re-calculates and updates the size of the content.

Ian McClure

You need to have the content be the new height before he animation ends. If not then it’ll be clipped by the bottom of the content layer.

When you call updateContent() it would calculate based on the heights of the cards as they are then it is called. If it gets called just after the animation starts the height of the card would be just slightly above 80 instead of the 300 that we want it.

Read the entire post on Facebook