0
    var lastId,
    topMenu = $("#article-nav"),
    topMenuHeight = topMenu.outerHeight()+15,
    // All list items
    menuItems = topMenu.find("a"),
    // Anchors corresponding to menu items
    scrollItems = menuItems.map(function(){
        var item = $($(this).attr("href"));
        if (item.length) { return item; }
    });

// Bind click handler to menu items
// so we can get a fancy scroll animation
menuItems.click(function(e){
    var href = $(this).attr("href"),
        offsetTop = href === "#" ? 0 : $(href).offset().top-topMenuHeight+1;
    $('html, body').stop().animate({
        scrollTop: offsetTop
    }, 300);
    e.preventDefault();
});

// Bind to scroll
$(window).scroll(function(){
    // Get container scroll position
    var fromTop = $(this).scrollTop()+topMenuHeight;

    // Get id of current scroll item
    var cur = scrollItems.map(function(){
        if ($(this).offset().top < fromTop)
            return this;
    });
    // Get the id of the current element
    cur = cur[cur.length-1];
    var id = cur && cur.length ? cur[0].id : "";

    if (lastId !== id) {
       lastId = id;
       // Set/remove active class
       menuItems
         .parent().removeClass("isActive")
         .end().filter("[href='#"+id+"']").parent().addClass("isActive");
   } 
});

ошибку показывает в этой строке offsetTop = href === "#" ? 0 : $(href).offset().top-topMenuHeight+1;

с алиасом перестал работать скрол,

<a href="тут-какой-то-алиас#ссылка на элемент">

вот так работало без проблем

<a href="#ссылка-на-элемент">
7
  • потому что $("#....") это валидный селектор, а $('бла бла бла #....') нет. разделите ваш href на две части до # и после. Если до не совпадает с текущим url страницы, то вообще обрабатывать не надо. В противном случае используйте полученный якорь
    – teran
    7 дек 2020 в 8:54
  • а по подробней можно ?
    – evsykov
    7 дек 2020 в 8:58
  • как мне его разделить ? регулярками ?
    – evsykov
    7 дек 2020 в 9:01
  • а вы видите какую то регулярность в примере asd#zxc ? Тут один четкий разделитель. К чему тут регулярки?
    – teran
    7 дек 2020 в 9:09
  • хорошо, тогда как мне правильно разделить ?
    – evsykov
    7 дек 2020 в 9:15

1 ответ 1

1

ищите якорь в this.hash

$("a").click(function(e){
   e.preventDefault();
   
   console.log(this.hash);

   
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<a href="#hash">with hash</a>
<a href="/no-hash">w/o hash</a>

то есть в вашем случае

 offsetTop = this.hash === '' ? 0 : $(this.hash).offset().top-topMenuHeight+1;
5
  • я думаю мне просто нужно вот в этой строчке offsetTop = href === "#" ? 0 : $(href).offset().top-topMenuHeight+1; указать что-то типа offsetTop = href == " " == "#" ? 0 : $(href).offset().top-topMenuHeight+1; но так не работает
    – evsykov
    7 дек 2020 в 10:51
  • @evsykov дополнил
    – teran
    7 дек 2020 в 10:58
  • к сожалению не сработало, ошибка в этой строке
    – evsykov
    7 дек 2020 в 11:13
  • Syntax error, unrecognized expression: #%D1%87%D1%82%D0%BE-%D0%BD%D0%B5 всё не буду копировать, так как ссылка русская
    – evsykov
    7 дек 2020 в 11:16
  • @evsykov из контекста вашего вопроса следовало, что все якори в ссылках меню были привязаны к элементам на странице. Если якорь это русский текст, то очевидно валидным слекетором он быть не может. разберитесь с тем, какие данные у вас в наличии
    – teran
    7 дек 2020 в 11:40

Ваш ответ

Нажимая на кнопку «Отправить ответ», вы соглашаетесь с нашими условиями использования и подтверждаете, что прочитали и поняли наши политику конфиденциальности и нормы поведения.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.