导航回首页#id

Question

我正在开发一个 Wordpress 自定义主题。它是一个单寻呼机，但有 8 个子页面。我的问题是如何导航到带有 ID 的特定部分（例如 <a href="#how">how</a> 从导航栏中的子页面到主页（主页）？我使用 twitter 引导框架和 wordpress 导航 Bootstrap Nav Walker .

我的 Javascript (main.js) 向下滚动到一个部分如下：

/*
 * Scroll to section
 */
$('body').on('click', '.section-link > a, .section-link', function () {
    scrollToSection($(this).attr('href'));

    return false;
});
if (window.location.hash) {
    scrollToSection(window.location.hash);
}

function scrollToSection(id) {

    var number = 0;

    if(! $('body').hasClass('scrolled')) {
        number = $('header.site-header').height() + 40;
    }

    $('html, body').animate({
        scrollTop: $(id).offset().top - $('.navbar-fixed-top').height() - number
    }, 500);
}

感谢您的帮助。

Answer 1

如果您使用自定义链接进行导航，那么只需硬编码 URL 和目标 div 的哈希 id：

然后将以下代码添加到您的 JS 中：

if(window.location.hash) {
  scrollToSection(window.location.hash);
}