Hi, I really like the simplicity of the vantage theme, however I’m having a problem with the sticky nav. I want to use sticky nav on the site, however when I change the opacity I can see a second menu behind it? How to do I hide the normal menu and only display the sticky menu? URL is included below.
Thanks!
Duplicate Navigation Menus, showing sticky and normal.
This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.
To clarify, you can see the menu behind the sticky menu when you initially scroll down the page. Thanks.
Hi Rocky
Try this under Appearance > Custom CSS:
nav::nth-of-type(1) { display: none; } .site-navigation.sticky { width: 100% !important; }Hi Andrew, unfortunately that didn’t work. Any other ideas? It’s strange that two menus exist.
Sorry about that, it should have been:
nav:nth-of-type(1) { display: none; } .site-navigation.sticky { width: 100% !important; }Give that a try.
Hello. I had the same problem as Rocky Tilney.
I was using the sticky menu and for some reason it started showing a duplicated menu underneath it when I scrolled down, like this:
http://gyazo.com/b47d2237194fcf2ba31f192decd7b37a
http://gyazo.com/c6dadfc60ecd623940435a70c47a9dc7
I fixed the problem using the code you gave him, and all seemed fine, that problem was gone.
But then another problem appeared.
See, this was one of the pages before I added your code to fix my initial problem:
http://gyazo.com/f6a319e11563a1eaebdb44212ff45d06
You can see the title “What is Bars in Lisbon?” clearly there. When I added the code though, it seems like the menu now overlays the top of every page, so the very top part of a page is not seen, like this from the very same page:
http://gyazo.com/811496ce855baea31ac6007f691f75ea
Is there a way to fix this?
Thanks in advance,
Tomás
Excellent, thanks Andrew. Worked fine!
Super, glad to hear that helped.
Hi Andrew, I noticed that when you place the code you provided we lose the mobile menu. Any way to fix that?
Looks to be working on my side. Did you make progress?
I have an opaque sticky menu as well and am having the same issue, but my menu doesn’t start at the top. How do I hide the main menu when it switches to sticky?
http://www.carsonroes.com
Hi Andrew, it works now because I removed the code you provided. The double menu is back, I’ll have to keep that until there is a fix. Thanks for your help.
I’m not getting the same result. Here is an example site:
http://hitdelete.com/
Custom CSS for the menu is:
nav:nth-of-type(1) { display: none; } .site-navigation.sticky { width: 100% !important; } .main-navigation { background: rgba(34, 34, 34, 0.8) !important; }I see one menu and my mobile menu is still working. Can you perhaps check this out and confirm.
Carson you can try this out if you’re keen.
That gets rid of the menu behind it, but it is permanently stuck to the top. I would like it to start under the logo than disappear as the sticky menu appears.
I know the effect you’re after. It’s unfortunately not something we can offer with Vantage as the theme currently stands. Sorry I don’t have more here.
Hi Andrew,
I had the same problem about the two sticky menus displayed. The code you provided solved it, but i noticed that also hidded the navigation at the bottom of my archive pages.
So i added to your rule one selector:
.site-navigation.sticky nav:nth-of-type(1) { display: none; }Thanks Eva. That looks good. Appreciate the share.
Hi Andrew,
I’m also having the same issue as Rocky Tilney above, in terms of duplicate navigation menus showing sticky on my mobile site: http://www.thevintageexplorer.com. When I placed the code you provided above into my Bldr theme CSS sheet, I also lost the mobile menu completely like Rocky did. Can you please assist? thank you! Lauren