JQuery Плавная прокрутка не работает

Question

У меня есть этот код для гладкой прокрутки:

$(".navbar-nav li a[href^='#']").on('click', function(e) { 
    e.preventDefault(); 
    $('html, body').animate({ 
     scrollTop: $(this.hash).offset().top 
    }, 1000); 
}); 

, который работает для ссылок как <li><a href="#intro">Intro</a></li> но это, кажется, не работает для ссылок, как: <li><a href="#home#intro">Intro</a><li> Любая идея, как сделать более поздняя ссылка работает?

Answer 1

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

Кстати, вы можете попробовать это и сохранить #intro в качестве последнего значения!

jQuery(".navbar-nav li a[href^='#']").on('click', function(e) { 
    e.preventDefault(); 
    var hash_array = this.hash.split('#'); 
    var hash = hash_array[hash_array.length - 1]; 
    jQuery('html, body').animate({ 
     scrollTop: jQuery('#' + hash).offset().top 
    }, 1000); 
}); 

Answer 2

Ссылка с несколькими # 'S не сможет быть истолковано как то, что „this.hash“ вы пытаетесь перейти к ... возможно, что-то подобное может работать:

$(".navbar-nav li a[href^='#']").on('click', function(e) { 
    e.preventDefault(); 
    hash = this.hash.split('#'); 
    $('html, body').animate({ 
     scrollTop: $('#' + hash[1]).offset().top 
    }, 1000); 
}); 

Demo : https://jsfiddle.net/f31m3h6L/1/