Question

导航栏的工作方式与平滑滚动一样，但我无法更改偏移量。我的导航是86px，但不管有多少px我改变它仍然会到同一个地方。

exec /var/www/script

我将信息直接添加到body标签中，但仍然没有变化。我知道jquery正在工作，因为它滚动平滑，折叠导航也可以工作。

$(document).ready(function () {
     $('body').scrollspy({target: ".navbar", offset: 86});   
     $("#myNavbar a").on('click', function(event) {
        if (this.hash !== "") {
            event.preventDefault();
            var hash = this.hash;
            $('html, body').animate({
                scrollTop: $(hash).offset().top
                }, 800, function(){
                window.location.hash = hash;
            });
         }
     });
});

Answer 1

我认为偏移不会影响你的想法。我不确定'滚动到'的位置。你必须用填充来做到这一点。

此上下文中的偏移量表示屏幕顶部与您滚动到的部分之间的距离。换句话说：它所做的就是确定导航栏的哪个时刻＆gt;标签更改为活动状态。

结帐：https://jsfiddle.net/wietsedevries/gu0b0dg2/1/

在这个示例中，我设置了data-offset="51"，导航栏的高度也是51px，所以当我向下滚动导航栏时，＆gt;当导航栏击中该部分时，标签会完全变为活动状态。

Answer 2

是的，偏移仅用于确定何时突出显示导航链接。点击链接时不要定位屏幕。即滚动部分取决于你。你可以用一点JS来做到这一点：

var offset = 80;

    $('.navbar li a').click(function(event) {
        event.preventDefault();
        $($(this).attr('href'))[0].scrollIntoView();
        scrollBy(0, -offset);
    });

Answer 3

Bootstrap使用偏移量仅解决间谍问题，而不解决滚动问题。这意味着滚动到适当的位置完全取决于您。

尝试一下，它对我有用：为导航点击添加事件处理程序。

var offset = 86;

$('.navbar li a').click(function(event) {
    event.preventDefault();
    $($(this).attr('href'))[0].scrollIntoView();
    scrollBy(0, -offset);
});

在这里找到它

https://github.com/twitter/bootstrap/issues/3316

bootstrap offset scrollspy无法正常工作

3 个答案: