如何在滚动中包括导航高度以避免重叠？

Question

我正在创建一个单页浏览器，并且需要单击滚动脚本以与固定部分和页面顶部之间的距离与固定导航栏的大小完全相同，以便在链接时保持干净的连接单击。

我已经使用了第二个锚，其代码如下所示：

.anchor-1 {
    display: block;
    position: absolute;
    top: -77px;
    visibility: hidden;
}

但是，如果我使用它，我的脚本将无法正常工作。

这是我的点击滚动脚本，其中包含“导航高度”。当我独自一人围困时，链接会处于理想位置，但是单击时链接并不会移至理想位置。

var sections = $('section')
  , nav = $('nav')
  , nav_height = nav.outerHeight();

$(window).on('scroll', function () {
  var cur_pos = $(this).scrollTop();

  sections.each(function() {
    var top = $(this).offset().top - nav_height,
        bottom = top + $(this).outerHeight();

    if (cur_pos >= top && cur_pos <= bottom) {
      nav.find('a').removeClass('active');
      sections.removeClass('active');

      $(this).addClass('active');
      nav.find('a[href="#'+$(this).attr('id')+'"]').addClass('active');
    }
  });
});

我需要在滚动位置添加一个nav_height，而不是让各个部分一直滚动到顶部，以便与顶部保持理想的距离。