Hello dear laytheme forum,
I would like to create a dynamic background color change when scrolling on a certain element on my page.
My projects start with a video section, followed by a stills section before landing on the footer on the bottom of the page.
I would like my site to dynamically change its background color from black to white once I scroll to the stills section.
Changing the background color of the elements in the row gutter is not an option as this would not change the complete background of the page.
Therefore I set a "white scroll" as # for the id of the desired elements/rows.
I would probably have to address this id in css and tell it to have a white background but for the whole page. Also it probably needs JS to be dynamic and respond to the scroll.
I searched online quite a lot but can only find super complex scroll effects with multiple colors, certain pixel scroll sizes, etc.
This is (I think) a more simple effect than what I can find online. Maybe its "as easy" as I think and someone can help.
This already goes in this direction, but i can't make it work for my purpose.
Desired order and color:
black (everything after stills: footer)
Thank you for helping!