Archived topic
Navigation menu items stay with hover color after being clicked
13 replies · Started by Andres on January 27, 2020
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.
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
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.
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.
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!
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.
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.
Did you resolve the issue ? As its only keeping the clicked item highlighted on my browsers
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.
Oh, and in mobile it's worse, all the elements of the menu you click remain highlighted forever.
Have you checked the plugins documentation ?
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!
Let us know how you get on - sorry we don't have a simpler solution.
Hi!
I had the same problem.
This css solved:
.menu-item a:not(.mPS2id-highlight){
color:#666 !important;
}
