Morphing split section

Hello everyone,

I’m actually building the portfolio of the studio and I have a struggle.
It’s a bit tricky, I made a lottie moving with scroll in background and split screen section appear for the text box.

Some are vertical or horizontal and they always going to enter with a slide animation.

I want my lottie moving with these blocks and morphing to halfscreen or full screen.
Instead of staying in background.

Do you have any idea if it’s possible to do ?

Here is my public share link: https://ferrstudio.webflow.io

Here is the result I try to achieve :



Kind regards,
Christopher

Hello,
I find something looking like what I want so I think I can do this.

https://calltoaction.webflow.io/

The concept is about morphing the background with the white DIV bloc on scroll.

Any idea please ?

Hi @Pandore, this is actually a cloneable from Josh Jacobs.

You can clone this, inspect it and incorporate things into your own project.

Hi @choreus, thanks for your feedback.

My wish is a bit different, cause this is a zoom animation and I want the bloc morph on scroll.

A y idea ? Regards

@Pandore, I’m not sure I totally understand what you’re trying to achieve. But looking at your example images and you talking about morphing the background with the white DIV, you could try setting a gradient as a background going from white to transparent for each section.