Skip to content
On this page

scrollTo

函数在指定的持续时间内将页面平滑地滚动到指定的位置。

引入方式

ESM

javascript
import { scrollTo } from "tool-assistant;

示例

javascript
// 引入 scrollTo 函数
import { setScrollTop, getScrollTop, offset, scrollTo } from "tool-assistant";

// 示例 1:将页面平滑地滚动到指定位置
scrollTo(500, 1000); // 将页面滚动到位置 500,动画时间为 1000 毫秒

// 示例 2:点击按钮平滑地滚动到元素位置
const scrollToElementButton = document.getElementById(
  "scroll-to-element-button"
);
scrollToElementButton.addEventListener("click", function () {
  const element = document.getElementById("my-element");
  const elementPosition = offset(element); // 使用之前提到的 offset 方法获取元素位置
  scrollTo(elementPosition.top, 800); // 平滑滚动到元素位置,动画时间为 800 毫秒
});

// 示例 3:滚动到顶部
scrollTo(0, 500); // 平滑地滚动到顶部,动画时间为 500 毫秒

// 示例 4:滚动到底部
const scrollToBottomButton = document.getElementById("scroll-to-bottom-button");
scrollToBottomButton.addEventListener("click", function () {
  const documentHeight = Math.max(
    document.body.scrollHeight,
    document.documentElement.scrollHeight
  );
  scrollTo(documentHeight, 1000); // 平滑地滚动到底部,动画时间为 1000 毫秒
});

Released under the MIT License.