Jquery scrolltop 偏移固定标头

Question

我正在使用 JQuery 来平滑滚动图像：

function smoothScrollTo(hash) {
    $("html:not(:animated).,body:not(:animated)").animate({
        scrollTop: $(hash).offset().top
    }, 650, function () {
        location.hash = hash;
    });
}
$(function () {
    $("#content-images li a[href*=#]").click(function () {
        this.blur();
        smoothScrollTo(this.hash);
        return false;
    });
});

它工作正常，但是我在网站上有一个固定的导航栏，它在滚动时停留在页面的顶部。当页面向下滚动到下一个图像时，它会在导航栏下方滚动，从而遮挡视线。

我的问题是，如何修改上面的代码来补偿我的固定导航栏的高度？

任何帮助将不胜感激，

T

Answer 1

变化：

scrollTop: $(hash).offset().top

到：

scrollTop: $(hash).offset().top + $('#fixed_nav_bar').outerHeight()

这应该考虑到固定的导航栏高度。

希望有帮助:)

Answer 2

使用 will 的答案，试试这个：

function smoothScrollTo(hash, t) { // two params
    $("html:not(:animated).,body:not(:animated)").animate({
        scrollTop: $(hash).offset().top + $('#fixed_nav_bar').outerHeight()
    }, 650, function () {
        var tmp = t.id; // hold the id
        t.id = '';      // remove it so we don't jump
        location.hash = hash;
        t.id = tmp;     // now that we didn't jump we can move it back
    });
}
$(function () {
    $("#content-images li a[href*=#]").click(function () {
        this.blur();
        smoothScrollTo(this.hash, this); // two args
        return false;
    });
});