JavaScript для верстальщика. Урок 05. Фиксируем меню при скролле

Чтобы при скролле страницы меню оставалось на своём месте, is не нужен, достаточно в css указать для него фиксированное позиционирование: position: fixed

Автор ставит более сложную задачу: меню прокручивается вместе со страницей и фиксированным становится только когда прокрутился блок header

Находим высоту блока header с id = "js-header", присваиваем значение переменной headerH

var headerH = $("#js-header").height();

Отслеживаем на сколько проскроллен документ.

Событие скролл

$(document).on("scroll", function(){
       
    })

Внутри создаём переменную:

var documentScroll = $(this).scrollTop();

Добавляем условие

if(documentScroll > headerH) {
            $("#js-nav-container").addClass("fixed");
            });
        } else {
            $("#js-nav-container").removeClass("fixed");
        }

 Код полностью

        var headerH = $("#js-header").height();
       
        $(document).on("scroll", function(){
        var documentScroll = $(this).scrollTop();
        if(documentScroll > headerH) {
            $("#js-nav-container").addClass("fixed");
        }
        else {
           $("#js-nav-container").removeClass("fixed");
        }
    })

P.S. Автор добавил ещё несколько усовершенствований в прокрутку, например, изменяет отступ навигации при прокрутке. Эти усовершенствования полностью описываются функциями addClass и removeClass