Для получения полного доступа
зарегистрируйтесь.
RSS

Все сниппеты с тэгами «JavaScript, affix menu»



Gravatar image
avkvak
  • Репутация: 1
  • Сниппеты: 0
  • Ревизии: 1

Благодарю автора zular за данный скрипт. Хотел написать коммент, но нажал чтото не то :) В общем, чтобы класс таки удалялся, на 6 строке лучше сравнивать в виде ">" а не ">=" ибо в нашем случае $(window).scrollTop() всегда >= 0

Здравствуйте, столкнулся с задачей фиксации меню при скролле страницы, был найден скрипт на просторах интернета, который решил мою задачу. Я его немного изменил под свои нужды.

Зависимости:

  • Jquery

Классы:

  • .nav-afix - само меню
  • .affix - класс который добавляется в после скролла

Преимущества скрипта:

  • не надо высчитывать отступ сверху (скрипт сам его отсчитывает)
// --- affix top menu script ---
$(() => {
    let target = $('.nav-afix');
    let startPosition = target.offset().top;

    $(window).scroll(() => {
        if ($(window).scrollTop() > startPosition) {
            if (!target.hasClass()) {
                target.addClass('affix')
            };
        } else {
            target.removeClass('affix')
        };
    });
});

Gravatar image
zular
  • Репутация: 36
  • Сниппеты: 7
  • Ревизии: 0

Здравствуйте, столкнулся с задачей фиксации меню при скролле страницы, был найден скрипт на просторах интернета, который решил мою задачу. Я его немного изменил под свои нужды.

Зависимости:

  • Jquery

Классы:

  • .nav-afix - само меню
  • .affix - класс который добавляется в после скролла

Преимущества скрипта:

  • не надо высчитывать отступ сверху (скрипт сам его отсчитывает)
// --- affix top menu script ---
$(() => {
    let target = $('.nav-afix');
    let startPosition = target.offset().top;

    $(window).scroll(() => {
        if ($(window).scrollTop() >= startPosition) {
            if (!target.hasClass()) {
                target.addClass('affix')
            };
        } else {
            target.removeClass('affix')
        };
    });
});