Docs

[jasonfox]

I need the sticky header to change to a solid background color on scroll.

http://dev.smithmountainhomes.com/

[Joao]

Hi There,

Please add the following codes to Appereance Customizer Custom CSS

CSS

.x-navbar-wrap {
     height: auto !important;
}

 .x-navbar {
     background-color:transparent;
     border:0;
     box-shadow:none;
     position: fixed;
     width:100%;
}

 .x-navbar-solid {
     background-color:white;
}

And the following code to Appereance Customizer CUstom JavasScript

jQuery(function($) {
    $(window).scroll(function(){ 
        if($(window).scrollTop() >50) {
              $('.x-navbar').addClass("x-navbar-solid");
        }else {
              $('.x-navbar').removeClass("x-navbar-solid");
        }
    });
});

Hope that helps,

Joao

[jasonfox]

Thank you for your quick reply.

I have added the code but it is not working?

[Joao]

Hi There,

Please check again if you used the code correctly.

If yes and it still does not work, would you mind providing us with login credentials so we can take a closer look? To do this, you can make a post with the following info:

– Link to your site
– WordPress Admin username / password
– FTP credentials

Don’t forget to select Set as private reply. This ensures your information is only visible to our staff.

Thanks

Joao

[jasonfox]

This reply has been marked as private.

[Rupok]

Hi there,

Thanks for the credentials. I have checked and seems you didn’t even add the CSS that was suggested. I have placed the code and it’s working fine as expected.

Cheers!

[jasonfox]

Thank you.

[Joao]

Great to hear it.

Let us know if you need help with anything else.

Joao

[Author]

Posts