Javascript 滚动至导航仅从第一个元素开始工作

我是一名javascript初学者，不能完全掌握需要做哪些更改才能使其正常工作

这是最新的

我有一个带有可折叠固定导航的容器。您应该能够单击每个导航项目并滚动到章节。问题是：它只适用于来自顶部或“第1章”。 当我点击导航章节两次时，它会上下移动，而不仅仅是指向它的锚

这是我在没有固定导航的情况下设置它时发现的javascript—要让它以我想要的方式工作，需要做哪些更改

function scrollNav() {
  $('.nav a').click(function(){
    //Toggle Class
    $(".active").removeClass("active");
    $(this).closest('li').addClass("active");
    var theClass = $(this).attr("class");
    $('.'+theClass).parent('li').addClass('active');
    //Animate
    $('#container').stop().animate({
        scrollTop: $(   $(this).attr('href') ).offset().top - 180
    }, 400);
    return false;
  });
  $('.scrollTop a').scrollTop();
}
scrollNav();

非常感谢

查看此更新。我添加了jquery库和用于调试的控制台

我发现了两个主要问题：

首先，在此处使用

.position（）

而不是

.offset（）

。偏移始终相对于文档，而位置相对于偏移父对象（可能是文档，也可能不是文档）。看见因为您对相对于父容器的位置感兴趣，所以应该使用

.position（）.top

一旦设置到位，就更容易推断scrollTop的正确值。当您滚动过目标元素时，其相对于

#容器的位置将为负值。如果
章节位置
为
-300
，当前滚动条为
1000
，我们希望滚动到700

但是请注意，这是因为
#container
div是固定位置的。在上面的提琴中，我用另一种方法来计算滚动，如果你不想粘性标题&因此不需要固定
#容器
。
你能给我们一个显示相同行为的例子吗？我不认为
$（$（this.attr（'href'））.offset（）.top
会像你想的那样，但是很难说没有能够轻松检查js&htmlHi Ebbishop，谢谢您的回复。这是我第一次设置JSFIDLE：下面是链接。但我无法让javascript正常工作。我读了一些stackoverflow线程，看看如何解决（将js菜单更改为“无换行”），但还没有找到解决方法。我还添加了粘性标题，以使这个容器具有完整的感觉。也可能与问题有关。谢谢下面的答案有用吗？这能解决你的问题吗？我觉得我太新手了——如果我的名声不到15，复选标记会被记录下来，但不会公开显示。。。。上面说。但我认为这是答案。