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

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

这是因为你必须覆盖bootstrap css。当您单击链接时，这里是伪：焦点类

的bootstrap css

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

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

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

One Page Nav JS＆gt;突出显示链接+滚动位置

1 个答案: