Hi. I’m trying to change the background color of my website as I scroll. I found a cloneable site that does this but it only has 5 sections and I need 7. I tried duplicating the sections and just changing the bg wrap color but it changes the color on both the cloned and original sections. Does anyone have a solution so that I can make more sections? Thanks!
- Share your project’s Read-Only link AND live site’s Published link
- The read-only link is a special url generated in the Dashboard to allow others to view your project in the Webflow Designer. How to get your project’s read-only link?
- The published link is the
<your-site>.webflow.iosubdomain where you can view the live site with custom code running. It is important to share this link, as custom code does not run in the Designer.
- Upload as many screen shots/screen cast videos as possible to help others help you faster
- Add a description of what you’re trying to achieve, and/or post a link to a working example of what you’re trying to achieve
- Reply to users by tagging using the @ sign followed by their forum username like this: @username
Hi. Go to interactions > page trigger > while page is scrolling > create new animation > then click on the operation you want, in this case it’s “bg color”, then you can set it to where you want your page to change color, eg. at 15% of the total page height you can set it change color. then you can adjust the smoothing to alter how rapidly and smoothly the change occurs.
I hope this was helpful.
Thank you! That worked.