语法
- element.scrollIntoView(); // 等同于 element.scrollIntoView(true)
- element.scrollIntoView(alignToTop); // Boolean 型参数
- element.scrollIntoView(scrollIntoViewOptions); // Object 型参数
参数
alignToTop (Boolean 型参数)
如果为 true, 元素的顶端将和其所在滚动区的可视区域的顶端对齐.
如果为 false, 元素的底端将和其所在滚动区的可视区域的底端对齐.
- scrollIntoViewOptions (Object 型参数)
- {
- behavior: "auto" | "instant" | "smooth",
- block: "start" | "end",
- }
1. 如果是一个 boolean,true 相当于 {block: "start"},false 相当于 {block: "end"}
2.behavior 这个选项决定页面是如何滚动的, 实测 auto 与 instant 都是瞬间跳到相应的位置, 而 smooth 就是有动画的过程
示例
- var element = document.getElementById("box");
- element.scrollIntoView();
- element.scrollIntoView(false);
- element.scrollIntoView({
- block: "end"
- });
- element.scrollIntoView({
- block: "end", behavior: "smooth"
- });
注意
取决于其它元素的布局情况, 此元素可能不会完全滚动到顶端或底端.
来源: http://www.bubuko.com/infodetail-3169740.html