Change menu text from white to black as it scrolls

EmilyLewis · March 7, 2023

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, 2023

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, 2023

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

Top Posters In This Topic

Popular Days

Top Posters In This Topic

Popular Days

Posted Images

tuanphan

EmilyLewis

Create an account or sign in to comment

Circle Benefits

Events

Circle Day

Resources

Product Updates

Squarespace Webinars

Hire a Designer

Support

Community

Developers

Resources