Modifying Menu Elements on Hover

[Ness]

Hey, I would like to achieve that the individual elements of my menu bar (Projects, Events, Team & Contact) change when hovered over with the mouse. Specifically, I want the 'Projects' tab to change to 'See Projects' upon hovering.

What would be the CSS code required for this?

I've already tried

.menu-item Projects span:hover

without success. The link to the website is https://ellsi.tha.de/

I appreciate any help :)

[arminunruh]

you'd need to use javascript to replace the text

google "javascript replace text on mouseover"
google "how to set a html class on a wordpress menu point"

sorry this is more of a programming question and less of a lay theme issue, i got too many things to do atm to code this for you

[Ness]

Hey Armin,

thanks for your feedback. After going through my question again, I realize I might have not expressed it clearly. What I'm actually looking to find out is the specific selector for my element, so I can access its style through CSS. Specifically, I'm referring to the selector for the "Projects" tab.

The code snippet I've already used was meant to show the selector I used:

.menu-item Projects span:hover

I've checked the Custom CSS Styling Guide as well, but I couldn't locate the right selector for this particular tab following its guidance. Here are two screenshots to further illustrate what I mean.

[arminunruh]

hey

please see this:
https://presscustomizr.com/snippet/adding-css-classes-wordpress-menu/