CMS Development

MariS
Member

Change header from fixed scroll

SOLVE

Hi all 

 

My header containing logo and menu is fixed on scroll. I would like to make it static so it vanishes on scroll. Please help me to do that?

0 Upvotes
1 Accepted solution
Jsum
Solution
Key Advisor

Change header from fixed scroll

SOLVE

@MariS,

 

No problem. 

 

The wrapper to your header has the class "top-bar-sticky". You have javascript in your simple_theme_functions.js file that is running a function on this class to make it sticky. You can simply comment this out and it should work.

 

This is the piece of js to comment out:

	$(".top-bar").hcSticky({
		wrapperClassName: "top-bar-sticky",
		className: "sticky",
		top: 0,
		stickTo: $(document),
		responsive: true
	});
	$(".header-img-slider").hcSticky({
		responsive: true,
		top: 0,
		innerTop: -124,
		stickTo: $(".body-container-wrapper")
	})

Just wrap it in /* CODE */  to comment it out. Also you can remove it but that isn't best practice for purchased templates since you essentially bought that piece of code. 

View solution in original post

0 Upvotes
4 Replies 4
Jsum
Key Advisor

Change header from fixed scroll

SOLVE

@MariS,

 

There are many ways to make this effect happen, so there are many ways to turn it off and they all depend on how it is turned on. Could you sharea a page link for us to look at?

0 Upvotes
MariS
Member

Change header from fixed scroll

SOLVE

HI @Jsum

 

Thanks for replying. It's actually a marketplace theme I got. I love it, I just want to adjust that navigation scroll 

 

http://ace.altdigital.co.za/blog

 

0 Upvotes
Jsum
Solution
Key Advisor

Change header from fixed scroll

SOLVE

@MariS,

 

No problem. 

 

The wrapper to your header has the class "top-bar-sticky". You have javascript in your simple_theme_functions.js file that is running a function on this class to make it sticky. You can simply comment this out and it should work.

 

This is the piece of js to comment out:

	$(".top-bar").hcSticky({
		wrapperClassName: "top-bar-sticky",
		className: "sticky",
		top: 0,
		stickTo: $(document),
		responsive: true
	});
	$(".header-img-slider").hcSticky({
		responsive: true,
		top: 0,
		innerTop: -124,
		stickTo: $(".body-container-wrapper")
	})

Just wrap it in /* CODE */  to comment it out. Also you can remove it but that isn't best practice for purchased templates since you essentially bought that piece of code. 

0 Upvotes
MariS
Member

Change header from fixed scroll

SOLVE

Thank you!!

0 Upvotes