Javascript .滚动至屏幕顶部带有固定横幅的元素

我已经想出了如何像这样制作scrollTop：

$("#nav-home").click(function() {
    $('html, body').animate({scrollTop: $("#content-home").offset().top}, 800);
});

但我的问题是，我在屏幕顶部有一个固定的横幅，因此当它滚动页面时，

#content home

元素的页面部分被横幅隐藏

我也在使用这个：

var hheight = $(".mainh").height();
var theight = hheight + 14;
$("#first-content").css("margin-top", mheight + "px")

根据横幅+2*7px边框（+14）的高度自动添加上边距。我知道这很愚蠢，但我很高兴它能这样工作

因此，我要求的是一种类似于增加补偿的方法。或者加上我上面提到的“保证金计算器”影响的第一个元素的偏移量

如果你能帮我解决这个问题，甚至可以添加一些提示，我会非常高兴。

使用这个

---

$（'.main'）.outerHeight（true）

为什么不将横幅的高度减去

滚动条的编号

var contentTop = $("#content-home").offset().top;
var hheight = $(".mainh").outerHeight(true); // the 'true' in the statement will include the top and bottom margin of the element, if they exist.
var scrollTopY = contentTop - hheight;

$("#nav-home").click(function() {
    $('html, body').animate({scrollTop: scrollTopY}, 800);
});

谢谢你，你的回答帮助了我。但由于某种原因，我不得不将“+hhight”替换为“-hhight”，当我让+在那里完美滚动时，它会滚动到内容主页之后的下一个元素。我真的不知道为什么会这样，但我真的不在乎，因为它现在工作得很好。@MasterTX你是对的，当然，我们应该减去标题的高度，而不是添加它！我的答案已被编辑以解决此问题~