Question

我的index.html页面上有一个按钮，如下所示：

关于我们

一旦用户点击此按钮并移至“关于我们”页面，我想将滚动条从页面顶部向下放置200px左右。我在SO上看到了一些关于如何使用jQuery插件移动页面的问题。但是，我希望能够首先导航到新页面，然后自动向下滚动页面以供用户使用。我的第一个想法是有一些jQuery只会在页面加载时关闭“关于我们”页面。但是，我只希望页面仅在单击索引页面上的链接时向下移动，而不是在用户从其他方式导航到页面时才向下移动。这可能吗？

Answer 1

如果about us页面上有一个带有ID的元素，您可以将链接更改为（请注意正斜杠不在ID之前）。

<a href="about.html#ElementID"/>

并将滚动点放在具有该ID的元素上。例如，此链接将带您回到此

This Link - https://stackoverflow.com/questions/28467667/how-can-i-change-the-scrollbar-location-once-a-link-is-clicked#answers

将带您进入此页面，但将滚动设置为答案表单。

如果您不想使用此方法，则可以尝试使用此Javascript

function ScrollPoint() { 
  var PageHeight=document.body.clientHeight;
  var params = window.location.search.substr(1).split('&');
  for (var i = 0; i < params.length; i++) {
    var a=params[i].split('=');
    if (a[0] == 'scroll') {
        // Add Validation the urlParam (0-9) only! Validation is good!
      var urlParam= decodeURIComponent(a[1]);
      var ScrollPoint=PageHeight-urlParam;
    window.scroll(0, ScrollPoint);
    }
  }

}
window.onload=ScrollPoint;

您可以在url /？scroll = 200中设置参数并使用javascript检查scoll =参数，如果设置了滚动参数，则会滚动到该点。

我希望这有帮助，快乐编码！

单击链接后如何更改滚动条位置

1 个答案: