Скрыть меню прокрутки вниз и показать на прокрутке вверх

Question

Я сделал этот код фрагмента, чтобы скрыть меню, прокручивая вниз, и покажись на прокрутке вверх, но у меня есть некоторые проблемы, когда я прокручиваю вверх, в меню по-прежнему фиксированная позиция, как я могу решить эту проблему, спасибо!
JAVSCRIPT:

$(window).bind('scroll', function() { 
    if ($(window).scrollTop() > 500) { 
     $('.mainmenu').addClass('nav-down'); 
    } 
}); 

// Hide Header on on scroll down 
var didScroll; 
var lastScrollTop = 0; 
var delta = 5; 
var navbarHeight = $('.mainmenu').outerHeight(); 

$(window).scroll(function(event){ 
    didScroll = true; 
}); 

setInterval(function() { 
    if (didScroll) { 
     hasScrolled(); 
     didScroll = false; 
    } 
}, 500); 

function hasScrolled() { 
    var st = $(this).scrollTop(); 

    // Make sure they scroll more than delta 
    if(Math.abs(lastScrollTop - st) <= delta) 
     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 (st > lastScrollTop && st > navbarHeight){ 
     // Scroll Down 
     $('.mainmenu').removeClass('nav-down').addClass('nav-up'); 
    } else { 
     // Scroll Up 
     if(st + $(window).height() < $(document).height()) { 
      $('.mainmenu').removeClass('nav-up'); 
     } 
    } 

    lastScrollTop = st; 
} 

CSS:

.mainmenu { 
    background: #222; 
    height: 50px; 
    padding: 0 15px; 
    width: 80%; 
    margin: 0 auto; 
} 
.nav-down{ 
    position: fixed; 
    top: 0; 
    transition: top 0.2s ease-in-out; 
    width: 100%; 
} 
.nav-up { 
    top: -50px; 
} 

Демо: jsfiddle

Answer 1

Добавить еще к вашему scrollTop с removeClass и вы должны быть хорошо, я проверил его и он работает. Здесь

$(window).bind('scroll', function() { 
if ($(window).scrollTop() > 500) { 
    $('.mainmenu').addClass('nav-down'); 
} 
else 
{ 
    $('.mainmenu').removeClass('nav-down'); 
} 
}); 

Answer 2

вам первым слушателем, просто добавьте еще заявление следующим образом:

$(window).bind('scroll', function() { 

    if ($(window).scrollTop() > 150) 
     $('.mainmenu').addClass('nav-down'); 
    else 
     $('.mainmenu').removeClass('nav-down'); 
}); 

Также обратите внимание, что вам не нужен setInterval() для второго слушателя см jsfiddle