Can you please tell me the best way to hide the mobile menu on scroll?
Ideally I would like the mobile menu to display on page load, then when you start to scroll, I would like the menu to slide up off the page so that you can see more of the screen, then as you begin to scroll back up, the menu would slide back down again.
Perhaps this is only possible with jquery which I know very little about.
Anything you can advise?
Thanks in advance...
Comments
http://codepen.io/andiio/pen/gspxJ
This is what our theme has by default. Just go to Customizing ▸ Header settings ▸ Type, variant, background ▸Sticky version ▸Hiding when scrolling down
With kind regards.
With kind regards.
Anyway script is in js/script.js look for
headerHorizontal: function() {
.Good luck!
Thanks for the luck, I think i'm gonna need it
However props for having big cohones ;-)
If I manage to find a fix (highly unlikely) ill let you know Something to consider for an update perhaps as I cant be the only one that wants a massive header to hide on a mobile device
@media screen and (min-width: 480px) { .header-horizontal #header.sticky-hide, .header-horizontal #header.hide-until-scrolled-to{ -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } }
This seems to work just as I need, with the hide on scroll option selected in the settings!
As your solution: if it works for you then this is most important. Bravo!
With kind regards.
For most people, having the menu act the same way as the desktop would be fine, but for me I prefer to deliver a stronger UX by delivering content that works just as well on a mobile as it would on a desktop, which this would as you can remove the top header and free up the space to fit more on the screen and maximise the visual area!
Such a relief that CSS can perform this task over more complex Jquery!
I PM'd you about another issue regarding the slug used for the works categories. Hopefully my last request now before the site goes live!
Thanks for all your help
Hurry up yea haha