Webflow animation expand

HI,

Can someone please explain how Webflow created the boxes to expand? And how the text inside is hidden until it expands? What settings would I put in the animation?

I’m trying to get this purple box to do the same.
https://preview.webflow.com/preview/hair-addict?utm_medium=preview_link&utm_source=designer&utm_content=hair-addict&preview=a68cbca13d35573a9eddd418cb5de0cd&pageId=6514a6e9e26d85d8d71d165d&workflow=preview

Thanks!
Kim


Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Yes , so basically it’s nothing but a div positioned at an absolute position in the parent div , covering the complete area . And when the page loads it moves away from left to right .

This can be done through page load animation and scroll into view animation .

Hi. I’m sorry I am not following. Everything I do also affects the text inside. Is there a way to have the text not effected by this? Thank you.

https://preview.webflow.com/preview/hair-addict?utm_medium=preview_link&utm_source=designer&utm_content=hair-addict&preview=a68cbca13d35573a9eddd418cb5de0cd&pageId=6514a6e9e26d85d8d71d165d&workflow=preview