XF 2.2 How to make navigation row background color change after scrolling down?

EchoRomeo

Active member
On my site (permittingforum.com), I have my navigation row color set to the background color (@xf-chromeBg). This is great when scrolled to the top of the page because it lets you see through to the header graphic but, when I start to scroll down, the navigation row background (which is sticky) switches to match the white background of the other site elements (e.g., the forum list) and you're no longer able to distinguish the white text of the navigation row buttons. This is also a problem on mobile devices where the header doesn't show and it's just the white navigation row with white text.

Does anyone know what I need to do to make the navigation row background color change (e.g., to a color similar to the header background) once the user has scrolled down past the header? I know there's a way to do this because I've seen it on other sites but have looked all over and haven't been able to figure this out.

Thank you!
 
You're using our Bolt - Header style which approaches it slightly uniquely way. You can edit just:

Style properties - > Navigation row -> Background color and that will change the background color for the sticky nav and the mobile nav. When it's not sticky and not on mobile, we use the custom opaque color.
 
You're using our Bolt - Header style which approaches it slightly uniquely way. You can edit just:

Style properties - > Navigation row -> Background color and that will change the background color for the sticky nav and the mobile nav. When it's not sticky and not on mobile, we use the custom opaque color.

That worked! I didn't think to try that. Thanks for clearing that up for me!
 
Back
Top Bottom