[Support request] Navigation menu items stay with hover color after being clicked

[Andres]

Hi!

I’m setting up a website with GP, and the one thing I can’t get to solve is that the menu items, for which I have anchor links, stay with their hover colors after I click on them, and it doesn’t stop until I click somewhere else in the website. How can I solve this? thanks.

[David]

Hi there,

best way to do that is using this plugin:

https://en-gb.wordpress.org/plugins/page-scroll-to-id/

They even provide a guide for setting up with Elementor

[Andres]

Hi David!

Thank you for your answer. Unfortunately, an extra plugin doesn’t sound like the right way just to correct the highlight bug. The anchor links and the animation is fine, I just don’t understand why the link keeps highlighted, it just makes no sense. Don’t you think another solution might me more reasonable? Thank you.

[David]

What seems like a very simple feature is actually rather complicated, which is why that plugin has over 100,000 downloads.

It also highlights the menu items based on user scroll – so it doesn’t just display the last link that was clicked.

[Andres]

Ok, I’ll try it. Guess I’m just obsessed on keeping the website like, that’s why I went for GP theme, but I’ll install de plugin and see if that works. Thanks!

[Andres]

Hi David!

Ok, I tried it, and it didn’t work. The last menu element clicked remain highlighted, even if I keep scrolling, until I click somewhere else on the screen. Any other ideas on how to solve this?

Thank you.

[Andres]

I mean, the plugin effectively highlights the section of the menu that is in view, but the last element clicked remains highlighted as well, unless I click again somewhere else. You can check it at the website. Thanks.

[David]

Did you resolve the issue ? As its only keeping the clicked item highlighted on my browsers

[Andres]

Hi David!

But does it remain highlighted when you scroll? ‘Cause that’s the problem of always, and keeps happening to me. i.e. I press on “Garantia”, and it highlights and scrolls to the section, but then “garantia” keeps forever highlighted even if I scroll somewhere else, until I actually click somewhere else in the website.

[Andres]

Oh, and in mobile it’s worse, all the elements of the menu you click remain highlighted forever.

[David]

Have you checked the plugins documentation ?

http://manos.malihu.gr/page-scroll-to-id-for-wordpress/

[Andres]

Yes, that’s how I managed to make the scroll highlight work, but I’ll go through it again and come back to you to see if I could solve it. Thanks!

[David]

Let us know how you get on – sorry we don’t have a simpler solution.

[Varga]

Hi!

I had the same problem.
This css solved:
.menu-item a:not(.mPS2id-highlight){
color:#666 !important;
}

[Author]

Posts