Skip to content

Instantly share code, notes, and snippets.

@ssbalakumar
Created February 16, 2018 11:57
Show Gist options
  • Save ssbalakumar/815aa5f243ce4c112d013a97347834f1 to your computer and use it in GitHub Desktop.
Save ssbalakumar/815aa5f243ce4c112d013a97347834f1 to your computer and use it in GitHub Desktop.
// Ref: https://www.elementcycles.net/
// Hide header on scroll down, show on scroll up
var did_scroll;
var last_scroll_top = 0;
var trigger_height = 5;
var navbar_height = $('.global-header').outerHeight();
$(window).scroll(function() {
did_scroll = true;
});
var set_interval = setInterval(function() {
if (did_scroll) {
hasScrolled();
did_scroll = false;
}
}, 250);
function hasScrolled() {
var scroll_top = $(this).scrollTop();
// Make sure they scroll more than trigger_height
if(Math.abs(last_scroll_top - scroll_top) <= trigger_height)
return;
// If they scrolled down and are past the navbar, add class .nav-up.
// This is necessary so you never see what is "behind" the navbar.
if (scroll_top > last_scroll_top && scroll_top > navbar_height && !$('html').hasClass('large-sub-menu-open')) {
// Scroll Down
$('.global-header').addClass('nav-up');
} else {
// Scroll Up
if(scroll_top + $(window).height() < $(document).height()) {
$('.global-header').removeClass('nav-up');
}
}
last_scroll_top = scroll_top;
}
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment