offset(）-top-XX在Webkit v Firefox/IE中给出了不同的结果

offset().top -XX gives different result in Webkit v Firefox/IE

本文关键字：结果 IE -top-XX Webkit Firefox offset      更新时间：2024-04-25

我正在尝试在具有固定标题的网站上实现平滑滚动到内部锚点。

如果我这样做：

scrollTop: $target.offset().top

我在所有浏览器中都得到相同的结果，但如果我这样做：

scrollTop: $target.offset().top - 100

这在Webkit浏览器中是可以的，但在Firefox和IE中，滚动到锚点后，页面会进一步弹出，因此标题在标题下会被遮挡。

整个脚本：

$('[href^="#"]').on('click',function (e) {
    e.preventDefault();
    var target = this.hash;
    var $target = $(target);
    $('html, body').stop().animate({
      scrollTop: $target.offset().top - 100
    }, 900, 'swing', function () {
      window.location.hash = target;
    });
});

和CodePen。

我找到了一个解决方法，改为在目标上添加填充顶部。

相关文章：