一页导航 JS > 突出显示的链接 + 滚动位置

Question

我正在使用 jQuery-One-Page-Nav（和 Bootstrap），但有两个问题：

• 当我滚动页面时显示活动链接，但当我单击链接时不显示
• 我点击链接时的位置不在该部分的顶部（我猜它缺少导航栏的高度）

整个网站都在这里：http://www.mrsmith.be/

样式表：http://www.mrsmith.be/css/style.css

我使用的js：

$('.nav').onePageNav({
    currentClass: 'current',
    changeHash: false,
    scrollSpeed: 750,
    scrollThreshold: 0.5,
    filter: '',
    easing: 'swing',
});

Answer 1

当我滚动页面时显示活动链接，但当我滚动页面时不显示 点击链接

这是因为您必须覆盖引导 css。 当你点击一个链接时，这里是伪 :focus 类的引导 css

.navbar-default .navbar-nav>li>a:focus, .navbar-default .navbar-nav>li>a:hover {
    color: #333;
    background-color: transparent;
}

所以，它保持灰色而不是红色。你可以点击body，它会变成红色....

之后： 使用scrollThreshold: 0.5 的事实使链接在目标达到屏幕高度的 50% 时变为活动状态...