Docs

[wmagroup]

Hi,

Currently have some custom code to get the header transparent and positioned over the top of the revolution slider.
Would like to get it so that once users have scrolled past the revolution slider the header background turns turns black.

As you’ll be able to see once you scroll past the slider you cant read the menu anymore.

website is http://www.wma.com.au

Thanks.

[Paul R]

Hi,

Thanks for writing in!

To make it black on scroll, you can add this under Custom > Edit Global CSS in the Customizer.

.x-navbar.x-navbar-fixed-top {
     background-color: #000 !important;
}

Hope that helps.

[wmagroup]

Hi Paul,

Thats great! Just also wondering when you scroll back up to the top if there is a way for it to back transparent.

Thanks.

[Thai]

Hi There,

Please add the following code under Customizer > Custom > Global Javascript:

jQuery(document).ready(function($){
	$(window).scroll(function(){
		if ($(this).scrollTop() == 0) {
			$('.x-logobar').removeClass('x-navbar-fixed-top');
		}
	});
});

Hope it helps 🙂

[Author]

Posts