js使页面滚动到特定元素上

最新推荐文章于 2024-04-17 11:59:13 发布

weixin_57768308

最新推荐文章于 2024-04-17 11:59:13 发布

阅读量2.4k

点赞数 1

文章标签： javascript 前端 html

本文链接：https://blog.csdn.net/weixin_57768308/article/details/129366110

版权

1. 使用Element.scrollIntoView()方法

element.scrollIntoView(); // 等同于 element.scrollIntoView(true)
element.scrollIntoView(boolean); // Boolean 型参数。 true: 元素的顶端将和其所在滚动区的可视区域的顶端对齐; false: 元素的底端将和其所在滚动区的可视区域的底端对齐
element.scrollIntoView(options); // Object 型参数

let dom = document.querySelector("#id") // 获取到元素
dom.scrollIntoView({
    behavior: "smooth", // 定义动画过渡效果， "auto"或 "smooth" 。默认为 "auto"。
    block: "center", // 定义垂直方向的对齐， "start", "center", "end", 或 "nearest"。默认为 "start"。
    inline: "center", // 定义水平方向的对齐， "start", "center", "end", 或 "nearest"。默认为 "nearest"
})