Sticky menu when scroll
 

Почему, когда я скроллю страницу, то класс добавляется, но как только я опускаюсь ниже секции, где меню, то у меня потом класс не отнимается?

$(window).bind('scroll', function () {
	if ($(this).scrollTop() > 50) {
		$('.menu').addClass('fixed')
    } else {
		$('.menu').removeClass('fixed');
    }
});

.fixed{
        position: fixed;
        z-index: 999;
        top: 0;
        left: 0;
        right: 0;
        padding-left: 120px;
        background-color: rgba(62, 12, 25, 0.6);
        color: #fd1d57;
        max-height: 8%;
        transition: 0.5s;
    }

Потому что этого в условии нет

$(window).bind('scroll', function () {
	if ($(this).scrollTop() > 50 &&  $(this).scrollTop() < тут ваше число px где нужно убрать класс ) {
		$('.menu').addClass('fixed')
    } else {
		$('.menu').removeClass('fixed');
    }
});

Все равно назад не цепляется. Да и зачем там (или), если есть (else)? То есть, если экран ниже 50, то тогда добавляем класс, если же нет, тогда отнимаем.

скрипт как должен понимать где меню?? пока что есть только 50px
если не сложно сделайте макет, или дайте ссылку
&& - это не или, это и