White block appears on Hero scroll

Hello Webflow community!

I’m working on a new hero scroll section, I’ve added a move and scale element trigger to the Container in which the Header is in. When I scroll down a white block randomly appears when it gets to the final stage at 90% which covers the text completely.

I’m sure it’s something really simple to figure out but I can’t seem to find the answer!

Would really appreciate some help :slightly_smiling_face: Here’s a read-only link to the page: Webflow - SOUTHWORKS Website

I’ve also added some screenshots to show the different stages of the hero scroll and what I’m talking about.

Many thanks!
Brendan

Hi @Brendan_Harper Your problem is with background image just remove the image entirely (bin it) and add it again it worked for me.

@Stan Thank you that did work but when I set the image back to Fixed, the white block appears again! So it seems to be an issue with Fixed/ Not Fixed. Ideally I would like the Hero text to scroll down the image, if that makes sense?

Why you need background image to have fixed position? it is background.

EDIT: I see :wink:

Haha thanks yes so that the text scrolls down the whole image instead of it being the text and image scroll as one.

So for example ideally I’d like it to look like this when it loads:


And then and the end of the scroll it looks like this:

Does that make sense? Also thanks a lot for your help :slight_smile:

I have found solution but I had to change a lot of things to make it happened.

https://www.loom.com/share/8aee7f12410a424a8b7c4cb7fbfb2c28

1 Like

Yes that looks great! I originally had it going from big to small but I actually really like this scroll action :smiley: What’s the process for this change?

I have made short video as I am very slow and sloppy writer :shushing_face:

https://www.loom.com/share/51366a73115f40389ef9090f2e670971

1 Like

@Stan You are a hero it has worked a treat :pray: Thank you so much for taking the time to make that video, really do appreciate it!

1 Like