Hide header on scrolling down and show it when scrolling up

Support
#1

Hi there,

So as the title suggests…Is there a way in Pro to make the header disappear when scrolling down and show it again when scrolling up?!

Thank you.

#2

Hello There,

Thanks for writing in! Regretfully there isn’t a feature that will make the header appear/disappear during scroll events. It can be done only with custom development. Please be advised that custom developments is beyond the scope of our support. We can only give you pointers as to how you can start your modifications and you will be the one responsible for the implementation.

You will have to detect the scrolling events and then apply opacity to the header element. Perhaps this thread may interest you: https://stackoverflow.com/questions/4326845/how-can-i-determine-the-direction-of-a-jquery-scroll-event

Thank you for your understanding.

#3

I was about to ask the same question and found an almost ready-to-use solution:

Explanation: https://medium.com/@mariusc23/hide-header-on-scroll-down-show-on-scroll-up-67bbaae9a78c

Demo: http://jsfiddle.net/mariusc23/s6mLJ/31/

#4

Hi there,

Thanks for sharing, and you may enhance it and integrate it to Pro header, but unfortunately, we can’t provide support for 3rd party codes or customization.

Thanks!