Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

How to Create Translucent Nav. Bar then Scroll to Solidify?


Site URL: https://wandpdesign.com/


I've been trying different methods to no avail on how to get a translucent nav bar that blends into the background when you open my site, and when you scroll down it turns into a smaller white bar up top. Attached link for example. 


I'm using the Clay template in the Brine Family. 


Thank you in advance!

Edited by mcgeesocial

Share this post

Link to post

1 answer to this question

Recommended Posts

  • 0

I see you fixed? https://wandpdesign.com/

If above link isnot your site

You need use JS/jquery + CSS to do this.

If you share link to your site, I can take a look. Each template has different class so need different code.

The idea here is that when scrolling down, JS will add a class to the nav, and you can use CSS for that class. When scrolling up, JS will remove that class so that nav can return to normal.

(If it's fast, I'll send the code. However if it takes longer than I thought, I will not answer free for this.)


COVID-19Free priority support for all users (29/03 - 30/04). You can tag me (@tuanphan) or send to my email.

With paid support, see here


Share this post

Link to post

Create an account or sign in to comment

You need to be a member in order to leave a comment

  • Create New...