I have interactions set up on my navigation bar so it switches to a “compact” version after scrolling a short way, and also inverts colours at certain points so you can still see it on a black background — this inverting is the main problem, as it requires precision.
I’ve tried using the “when scrolling in view” interaction attached to sections with black backgrounds. I also tried with a “while page is scrolling” trigger, thinking it would help as the distance down the page would stay relevant, but it doesn’t.
For instance, if you make the window very short, you can see the interaction happening with no scroll, or if you view the site on a very large screen the invert filter doesn’t occur at the correct points over the black backgrounds. I hope this makes sense, any and all suggestions are very much appreciated.
With “while scrolling in view” (applied to header div and black background text section):
With “while page is scrolling”: