Issue with button hover

I added an animation to change the website’s nav bar to black on scroll, but my buttons, when hovered, don’t change color anymore, and I can’t figure out how to fix it. Any help would be appreciated!

Website Link:

Here is my site Read-Only: LINK
(how to share your site Read-Only link)

Hey there :wave:

Are you referring to the “Book Now” CTA button in the NAV?

Upon hover, I was able to get the color to change to the (#109ec2) color both before and after the nav interaction.

Here’s what I see: Loom | Button Hover results

Hopefully, you got this resolved. If not, send over a Loom or screenshot to help out further.


Hello! I was actually referring to the other three buttons (Home, Services, and More). They would normally turn blue on hover, but they stopped working after I added to color change through an animation. Any help would be greatly appreciated!

Hello, it seems I have the same issue. My best guess is that the color change through animation overwrites all states of an element and not just the “normal” state. So, you see no change when hovering or clicking anymore.

So far I have not figured out how to change the color of an element in a specific state :frowning:

Hello @jackpitstick

I now solved it with a workaround. I created a second button, with the color scheme for dark mode, and set it to “Hidden”. Instead of changing the color by changing to dark mode I am now hiding the “Light mode” Button and setting the “Dark Mode” Button to show. This works just fine in my case. I hope this helps. :slight_smile: