Javascript 如何在滚动条上包含导航高度以避免重叠？

我正在创建一个onepager，需要我的“单击滚动”脚本与锚定部分和页面顶部保持一段与固定导航栏大小完全相同的距离，以便在单击链接时有一个干净的连接

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

.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');
    }
  });
});

var sections=$（“section”）
，资产净值=$（“资产净值”）
，nav_height=nav.outerHeight（）；
$（窗口）.on（'scroll'，函数（）{
var cur_pos=$（this.scrollTop（）；
节。每个（函数（）{
var top=$（this）.offset（）.top-导航高度，
bottom=top+$（this.outerHeight（）；
如果（当前位置>=顶部和当前位置