Archived topic
active menu changes when hovering other menu elements
3 replies · Started by Davide on October 16, 2021
I've a rather "bizarre" question
let's take this example:
http://arc.davidecrivelli.com/simpson/
Is it achievable, with only CSS, to have the following: when I hover a menu element with the mouse, the "current" element also change.
for example here http://arc.davidecrivelli.com/simpson/ "simpson" is the current, when I hover "startseite" or "hallo welt", "simpsons" will also change.
Is it something possibile with only CSS? Or some Jquery has to be involved in this?
Thanks!
Davide
Hi there,
You could use some CSS to detect hover on the Menu UL and then pass the styles to the current menu item like so:
.main-navigation .main-nav>ul:hover .current-menu-item a {
color: #f00;
background-color: #0f0;
}it would apply to hovering over any item in the list other than the current menu item.
so simple! :)
thank you very much!
Davide
You're welcome!
