New to the community? Start here

Enfold Theme: change menu background color on scroll

Looking for CSS to cause the menu bar and menu meta (top bar) background on the home page to be white with no transparency when the user scrolls the page NOT in the initial state.

Fri, 17 May 2019 16:14:25
  • Adam
    • Support Gorilla

    Hi Brett

    I hope you’re well today and thank you for your question!

    There seems to already be such effect implemented but it just sets some additional color that makes the header gray(ish). If I correctly understood your request, this CSS should do the trick for you:

    #header:not(.av_header_transparency) {
    
background-color:rgba(255,255,255,1);
    
}
    
#header:not(.av_header_transparency) #header_meta,
    
#header:not(.av_header_transparency) #header_main {
    
background: transparent!important;
    
}

    Try adding it to your site e.g. via “Appearance -> Customize -> Additional CSS” or via some custom css option of the theme (if there is any) and make sure to clear all caches (especially automptimze one) after doing this.

    It worked when tested directly in browser so give it a try and let me know, please, if it did the job for you :slight_smile:

    Best regards,

    Adam