Different color menu items

enolbos · September 2018

Hi,

My client has a transparent, fixed menu. When it scrolls, it is no longer transparent and the menu items are visible. However, when the menu is transparent, it's difficult to read.

I would like to make the menu items a different color when the background is transparent. Is there a way to do this?

Thanks,

Brian

Bryan · September 2018

Hello Brian,

what exactly do you want to achieve?

Do you want different colors for different menu items?

You can just change the menu items colo in theme options>colors>menu.

If you just want to change the menu colors when you scroll down then it will be only possible with custom css. Please send us a link to your website.

thanks

enolbos · September 2018

https://thecyclepoint.com/

While the menu has a transparent background, I want the menu items to be white. When the menu background appears, I want it to remain as it is currently. The point is to make the menu a bit more visible when the background is transparent.

Thanks,

Brian

Pablo · September 2018

Hi,

Paste this Custom CSS into Theme Options > Custom CSS & JS > CSS

.top_bar_left .menu-item{
	background-color:rgba(255,255,255,0.9);
        color:white !important;
 }

Cheers

enolbos · September 2018

Thanks... I only need the text to be white, though. No worries.

Pablo · September 2018

I updated the code above.

Is there anything else I can help you with?

Greetings

Different color menu items

Comments