Hide Menu and Header on scroll

Hide Menu and Header on scroll

  
Hi Guys,

I'm creating a page where I want to hide the menu and header logo when scrolling down... what's the best way of doing it?

Thanks
Gary
Hi Gary,

If you're using london the best way would be to remove the fixed from the Header class. So you may need to overwrite the class and also adjust the Content padding top to compensate.
Something like this

.Header {
    position: relative;
}

.Content {
   padding-top: 0px;
}

There might be other necessary adjustments other than the Content but is a matter of fixing them :)

Hope this helps
Guilherme
Perfect... leads me on to another question...
My page is a long scrolling page, now the menu is missing... how can I implement a jump to top or at least the 'burger' menu shown..?
You can just add a button or link on bottom (like a back to top) and onclick use the jquery scrollTop

$(document).scrollTop();

Or you could use an animation to make it slower:

$('html, body').animate({scrollTop:0}, 'slow');

Cheers
Guilherme
d
Hi Gary,
you can use jquery scroll as Guilherme said, or with animation to make it slower, causes it effects more user friendly. However, yo ucan jump direct to any place you want, just put some anchors and link them like the example down: An expression: "
<a name=""Home"" class=""AnchorSet""></a>" and then in css:
a.AnchorSet { display: block; position: relative; visibility: hidden;}
This way you jump directly in your page to teh anchor you have choosen.

Best regards
Andrew Tabata

Thank you for the tip - I'll give it a go..