如果单击上一页上的按钮，则自动滚动

Question

比方说，页面（页面A）上有两个按钮（按钮1和按钮2）。单击这两个按钮时，它们都指向相同的外部页面（页面B）。如何做到这一点，以便单击按钮1时，它会指向外部页面B的顶部，并且该按钮2会自动使页面向下滚动到页面的某些区域。

我认为示例代码看起来像这样：

<div id="b1" class="button"> </div> <div id="b2" class="button"> </div>

在javascript功能的外部页面上：

function initPage() {
 if(scrollTo1k == true)
  {
    body.animate({scrollTop: 1000}, 1000);
  }
}

编辑：我现在可以使计算机将新页面打开到所需位置，但是打开页面时不存在滚动效果。

Answer 1

您可以考虑使用一些<a>标签

这样，您可以像

一样设置第一个按钮。

<a href="targe-page-url">

第二个按钮应该是

<a href="targe-page-url#section-id-to-reach">

将使用HTML书签链接 W3C Sample of Bookmark link 这将连接到像<div id="section-id-to-reach">这样的div 因此，跳转到所需区域直接由浏览器处理

然后，滚动至目标位置不需要任何Javascript。 可以通过将此CSS属性添加到页面来实现滚动效果

body {
    scroll-behavior: smooth;
}

Answer 2

如果您有一个元素，则希望滚动到该元素即可

$([document.documentElement, document.body]).animate({
    scrollTop: $("#some-element-id").offset().top
}, 1000);