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
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. https://framer.cloud/CPANg
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.
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.