Hi everyone,
First of all, I'm still entirely new to Lay Theme, but I'm enjoying a lot to work with it and thanks a lot for all your hard work on it and this community.

There are already some forum posts about the issue I'm currently facing, but I couldn't find/understand a proper solution.

I'm using a fullscreen slider as an introduction for the website, and I want to use a white logo (png with transparent bg) and white navigation elements in front of this slider. When you scroll and the fullscreen slider disappears, it should exchange

  • list item the logo (a different coloured png)

  • the colour of the navigation elements

  • to a white background instead of a transparent one

I know there should be a possibility to do this with IntersectionObserver. Still, as I'm not very familiar with jQuery, I would be very thankful to anyone who can explain or reference an "easy" solution for this problem. (Also, I'm just slightly scared how to include it in the custom HTML & CSS section as I don't want to break anything ^^)

Here is the website as a reference; I hope everything is understandable:

All the best