On my website’s home page, I have a scroll down interaction for two buttons on the right side of the screen (“Need help?” and “Join our email list”). When scrolling down, they fade to 20% opacity. When scrolling up, they restore to 100% opacity. This is on tablet and smaller only.
The interaction works fine, to start with. I scroll down and the buttons fade properly. I scroll up and the buttons restore properly. But if I scroll down again after that, only one of the buttons fades and stays faded. The other one shows the fade animation and then pops into full opacity when it shouldn’t. This happens on my iPhone browser only as far as I can tell. Things work as they should in the designer preview and on a resized desktop window.
Any idea what could be causing this or how to fix it?
Here is my public share link: Webflow - Northlands Rescue Mission New