This thread is over two years old and may be outdated. Please create a new thread if you need help, or email us if you have an active Premium license.

Transparent Menu on top, color background when scrolling

Open 5 replies premiumthemetheme-vantage
Jose AMezcua
11 years ago · Last reply by Andrew Misplon 11 years ago

Hello Site Origin Team,

I want my menu to have a white background when on “sticky” mode.

I have this css which I found in a previous thread:

/* Vantage Logo in Menu Transparent Menu BG */
nav:first-of-type { display: none; }
.main-navigation.sticky {
  width: 100% !important;
  background: none !important;
}
.main-navigation {
	background: none !important;
	box-shadow: none !important;
}
   #main { padding-top: 100px; }
  .home #main { padding-top: 35px; }

Hope you guys can help! Great theme btw, and better support; I have found almost everything I needed just looking at previous threads.

Have a good one :)

URL: http://servicioswebmex.com/

This is our free support forum. Replies can take several days.

Need fast email support? Get SiteOrigin Premium

Replies

5
  1. Andrew Misplon Staff 11 years, 1 month ago

    Hi Jose

    Glad to hear you’ve been making progress.

    If you’re using the Logo in Menu layout then I’m not sure this is possible. In this layout the sticky menu sits over the main menu, even at the top of the page. There is no specific style that’s added when at the top of the page. So it’s not possible, at least with what we have, to differentiate between when the menu is sticky and not.

    Here what you can try, remove the other CSS targeting this first:

    .main-navigation.sticky { 
background: rgba(255,255,255,0.4);
}

    Adjust as required.

  2. Jose AMezcua 11 years, 1 month ago

    Hello Andrew,
    thanks for the fast reply! I tried it and it kind-of worked, I was looking to get this effect: http://www.michaelgonzalezfirm.com/ but now I not so sure about using the sticky menu at all, so when I tried disabling it in theme settings the menu disappeared all together. Im guessing it is because of this:

    nav:first-of-type { display: none; }

    Also, when on mobile there is no menu icon or menu or anything :o

    thanks in advance and again great theme, and better support!

  3. Andrew Misplon Staff 11 years, 1 month ago

    Vantage unfortunately isn’t yet setup for an effect like you’re after. Yes, the CSS you have inserted from my previous thread is causing the problem now. That CSS assumes you have sticky activated.

    The following, with sticky menu and logo in menu activated will show a transparent top menu. It unfortunately doesn’t work with the menu in search option activated:

    /* Vantage Logo in Menu Transparent Menu BG */
nav:first-of-type { display: none; }
.main-navigation.sticky[style] { width: 100% !important; }
.main-navigation {
	background: rgba(255,255,255,0.5);
	box-shadow: none !important;
}
#main { padding-top: 100px; }
.home #main { padding-top: 35px; }

    There is unfortunately only so much we can do from the support department. Big changes like these would ideally be a feature suggestion and then worked into future theme development.

    https://siteorigin.com/suggest-feature/

    Sorry I don’t have more.

  4. Jose AMezcua 11 years, 1 month ago

    Hey Andrew,

    do not apologize you have been great! I will try your code in a while! I have one last question, I currently develop low budget websites on wordpress and I am using vantage A LOT. I can´t remember if in the pricing options there is an unlimited website package; if it is great ill buy it, if not could we make it happen?

    thanks,
    J

  5. Andrew Misplon Staff 11 years, 1 month ago

    Thanks for your understanding. If you like how this last snippet works and really need search in the nav, let me know and I’ll re-look at that.

    $50 is our unlimited deployment offer. We don’t mind adding orders up. So for example if you’ve paid $10, just checkout next time at $40, drop me a mail on [email protected] and we’ll mark that as multi-site.

    Thanks for your support.

Replies on this thread are closed.

Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Have a different question or issue?

Start New Thread