【问题标题】:How to make a button scroll down page in HTML?如何使按钮在 HTML 中向下滚动页面?
【发布时间】:2013-11-16 19:23:37
【问题描述】:

在任何地方都找不到这方面的教程,或者只是没有使用正确的关键字。 我正在制作一个单页网站,我希望导航栏按钮可以将页面向上/向下滚动到右侧。 这是否可能仅在 HTML 和 CSS 中实现?
我对 JavaScript 不是很熟悉。

类似于“滚动到顶部”,但我可以决定将页面滚动到哪里,例如中间、顶部、底部等。

【问题讨论】:

标签: javascript html css scroll


【解决方案1】:

更新:现在有更好的方法来使用它,使用 HTML id 属性:

设置目标id:<h1 id="section1">Section 1</h1>

并使用锚标签创建指向该目的地的链接:<a href="#section1">Go to section 1</a>

这种新方法的好处是可以在任何 HTML 元素上设置id 属性。您不必再在目标链接周围包裹多余的锚标记!

原答案:

您可以查看使用 HTML 锚标记。

<a name="section1">Section 1</a>

同时

<a href="#section1">Go to section 1</a>

当用户点击“转到第 1 部分”时,他们将被发送到显示“第 1 部分”文本的页面部分。

【讨论】:

  • 此外,请查看this link 为滚动设置动画,而不是立即将用户跳转到那里
  • 那么这里有另一个问题。当用户滚动到它的位置时,如何让我的 JS 图像幻灯片开始?现在它只是在页面加载后立即运行。
  • 您需要检测该元素在页面上是否可见。看看这个问题:stackoverflow.com/questions/487073/…
【解决方案2】:

使用window.scrollTo,您可以像这样向下滚动页面

window.scrollTo(0,document.body.scrollHeight);

【讨论】:

    猜你喜欢
    • 2012-02-05
    • 2023-01-17
    • 2021-04-09
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2017-10-29
    • 2015-01-19
    • 1970-01-01
    相关资源
    最近更新 更多