Docs

[Mr.alriksson]

Hi,

I tried to make the menu transparency until scroll and when scroll folds out a colored background. I can do it transparency but not fold out a background color when start scroll.

[Rahul]

Hey There,

Thanks for writing in!

To assist you with this issue, we’ll first need you to provide us with your URL. This is to ensure that we can provide you with a tailored answer to your situation. Once you have provided us with your URL, we will be happy to assist you with everything.

[Mr.alriksson]

This reply has been marked as private.

[Rue Nel]

Hello There,

To have a transparent header and then with a background color as you scroll it, please add the following css code in the customizer, Appearance > Customize > Custom > Edit Global CSS

#top .x-navbar {
    background-color: transparent;
}

And then, please add the following JS code in the customizer, Appearance > Customize > Custom > Edit Global Javascript

jQuery(document).ready(function($){
	$(window).scroll(function(){
		if ($(this).scrollTop() > 200) {
			$('.x-navbar-fixed-top').css("background-color", "#fff");
		} else {
			$('.x-navbar-fixed-top').css("background-color", "transparent");
		}
	});
});

Hope this helps.

[Author]

Posts