Javascript 固定标题和引导粘贴/滚动间谍问题-未跳转到正确位置

我在尝试将内容的位置跳转到子导航旁边时遇到问题：

这是一个演示

正如你所看到的，当你点击一个链接时，由于固定的标题，它不在导航旁边。内容将经过标题

<script type="text/javascript">
    $(document).ready(function(){
        $("#myNav").affix({
            offset: { 
                top: 125 
            }
        });
    });
</script>

$（文档）.ready（函数（）{
$（“#myNav”）。粘贴({
偏移量：{
排名：125
}
});
});

有什么想法吗

---

干杯

我对你的问题投了赞成票，因为我正在努力解决这个问题

$(window).on('click.bs.affix.data-api',

这是当我们点击导航栏时发生的事件

这不太可能是手工制作词缀的方法，我希望在开发过程中有比我更好的人能帮助你…：

Bootply:

$(window).on('click.bs.affix.data-api', function(){

    setTimeout( function(){
        $target = $("#myNav li.active a").attr('href'); 
        $target = $( $target );
        //alert($target);
        $top = $target.offset().top - $('.page-header').height();

        window.scrollTo( 0 , $top);
        e.stopPropagtion();

    }, 10);

});

Js:

$(window).on('click.bs.affix.data-api', function(){

    setTimeout( function(){
        $target = $("#myNav li.active a").attr('href'); 
        $target = $( $target );
        //alert($target);
        $top = $target.offset().top - $('.page-header').height();

        window.scrollTo( 0 , $top);
        e.stopPropagtion();

    }, 10);

});

SetTimeout因为他以前做过他的工作

评论后更新：

Bootply:

$(window).on('click.bs.affix.data-api', function(){

    setTimeout( function(){
        $target = $("#myNav li.active a").attr('href'); 
        $target = $( $target );
        //alert($target);
        $top = $target.offset().top - $('.page-header').height();

        window.scrollTo( 0 , $top);
        e.stopPropagtion();

    }, 10);

});

摘录：

setTimeout（函数（）{
$target=$（“#myNav li.active a”）.attr（'href'）；
$target=$（$target）；
//警报（目标美元）；
$top=$target.offset（）.top-$（'.page header'）.height（）；
滚动到（0，$top）；
e、 停止呼吸（）；
$（“#myNav li.active a”）.removeClass（'active'）；//准备好了一个丑陋的解决方案，但哪一个对我有效？
在所有附加的锚上，我添加了一个类affix-anchor

然后，在我的css中：

.affix-anchor{
    padding-top:60px;
    margin-top:-60px;
}
.affix-anchor:first-of-type{
    margin-top:0px;
}

当然，这可以通过javascript大规模实现，而不是使用javascript滚动，只需添加一个相对定位的div作为锚：

<section>
    <div id="my-anchor-id" style="position: relative; top: -50px"></div>
    Content
</section


内容
您好，感谢您的回复，它似乎正在使用该代码，但当我单击一个链接时，它会将上一个
突出显示为活动的，例如，我单击链接2，它会将链接1设置为活动的？有什么想法吗？当我单击列表中的第二个链接时，它不会变为活动的，它只会跳到顶部，并选择第一个链接为活动的。我认为可以，但我会等待您的返回。真奇怪，当我添加到我的代码库中时，它仍然使用您所做的新代码进行操作。当我进来时，第一个
处于活动状态，然后我单击第二个
，它会跳回第一个
。它似乎一直在选择前一个
处于活动状态？我无法用小提琴复制它，它对我有效吗你（小提琴手）？如果小提琴为你工作，你能分享一个不工作的链接吗？