javascript - 使用#anchors 移动带有额外定位的滚动条

Question

是否可以更改滚动条相对于新哈希标签的位置？ 目前，页面滚动到使用#target 定位的元素的顶部，这是正常行为。有没有办法移动它，以便页面滚动到比 anchor 标记更远的页面下方 100 像素(在 anchor 标记之前添加额外的 100 像素)？

不确定是否应该使用 anchor 或 javascript 的狡猾放置。不确定我是否真的能够改变 anchor 的位置，所以我希望有一个 javascript 解决方案。

谢谢

Answer 1

您可以结合这个问题的答案:On - window.location.hash - Change?

加上一些额外的逻辑:

$(function(){
  var win = $(window); //cache your jq objects!
  function fixScrollTop(){
    win.scrollTop(win.scrollTop() + 100);
  }
  if(window.location.hash !== ""){
    fixScrollTop();
  }
  win.bind('hashchange', fixScrollTop);
});

哦，如果您可以控制 URL 中的#anchor，您可以(可能取决于您所追求的浏览器兼容性)将其设置为具有使浏览器滚动到的 ID 的任何元素的 ID