Transparent main menu

Hi Semel!

So you want to reverse the header behavioral appearance (scrolled/non-scrolled)?

Regards,
Josue

Hi,

Can you post the link to your website please?

Regards,
Josue

Hey!

This will make the header stay white when scrolled:

#header.header-scrolled {
background: #FFF !important;
}

Regarding making it transparent by default i think you must first decide what background you’ll put behind it because otherwise you would not note if its transparent or not, for example, add this too to the Quick CSS:

#header {
    background: url('http://seanhalpin.io/assets/img/content/nav/header-logo-mask.png') gray;
}

Regards,
Josue

Hey!

Post a link to the img you want as a background. A mockup of what you want to achieve would be helpful too.

Cheers!
Josue

Hey!

Add this code to the Quick CSS:

.header_bg {
    background: rgba(255, 255, 255, 0.6) !important;
}
#main {
    padding-top: 0 !important;
}

Result:

Cheers!
Josue

You are welcome, glad we could help :)

Regards,

Josue

Hi,

Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

#top .av-main-nav .avia_mega_div,
#top .av-main-nav ul,
#top .av-main-nav ul a {
  background: transparent !important;
}

If you don’t have a megamenu, you may remove the first line. :)

Please let us know if you need further help.

Best regards,
Sarah

You’re welcome! Do you need further help with this, or may we close this thread? :D

Best regards,
Sarah

Hi diegogacitua,

Could you please give us a link to your website, we need more context to be able to help you.

Best regards,
Victoria