Change menu text from white to black as it scrolls

EmilyLewis · March 7

Hey, I need help with a website I'm building for a client.

I have the menu set as 'dynamic', making the background transparent with white text. Then, when you scroll the menu background turns solid white.

However, when the menu background is solid white, the text is also white. This is the problem. I want the text to change to black/grey when it's on a solid white background when it starts scrolling, but keep it white at the top. Does anyone know how I could change it?

(I've added a couple of images to show what I mean)

PS. When I change the text colour in the styles menu to black, then it shows black on the transparent menu too, which I don't like.

tuanphan · March 8

Hi,

Add this to Design > Custom CSS. If it doesn't work, please share your site url, we can check easier

header#header.shrink div.header-nav-item * {
	color: black !important;
}

EmilyLewis · March 27

On 3/8/2023 at 1:12 PM, tuanphan said:
Hi,

Add this to Design > Custom CSS. If it doesn't work, please share your site url, we can check easier
header#header.shrink div.header-nav-item * {
	color: black !important;
}

Hey @tuanphan thank you!

Change menu text from white to black as it scrolls

Recommended Posts

EmilyLewis

Link to comment

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Posted Images

tuanphan

Link to comment

EmilyLewis

Link to comment

Create an account or sign in to comment

Resources

Squarespace Webinars

Hire a Designer

Support

Community

Developers

Resources