Установить родителя выпадающего списка в качестве активной ссылки с помощью прокрутки - PullRequest
0 голосов
/ 16 апреля 2020

У меня есть некоторый JQuery, который добавляет класс active к навигационной ссылке навигационной панели, когда пользователь прокручивает этот раздел или выбирает их на навигационной панели. До сих пор это прекрасно работало, однако теперь я изменил структуру сайта так, чтобы панель навигации содержала раскрывающееся меню.

Я бы хотел адаптировать свой сценарий, чтобы родитель оставался выбранным при прокрутке любого из дочерних элементов. (поскольку выпадающий список вряд ли будет виден), и он частично работает. Однако, если я установлю атрибут href для родителя, раскрывающийся список не откроется. Если я удаляю этот href, то выпадающий список работает, но родительский объект устанавливается как активный!

HTML

image

JQuery

$(document).ready(function() {

  //Initialise scrolling
  var scroll = new SmoothScroll('a[href*="#"][data-scroll]', {
  header: '[data-scroll-header]',
  });

  //Change navbar active class
  $(window).scroll(function (event) {
        var scrollPos = $(document).scrollTop();
        if (scrollPos === 0)
        {
            $('a[href^="#home"]').addClass('active');
            return;
        }
        $('.nav-item a').each(function () {
            var currLink = $(this);
            var refElement = $(currLink.attr("href"));
            if (refElement.position().top - 78 <= scrollPos && refElement.position().top + refElement.height() > scrollPos) {
                $('.nav-item a').removeClass("active");
                currLink.addClass("active");
            } else {
                currLink.removeClass("active");
            }
        });
    })
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...