滚动scrollIntoView的使用,鼠标点击元素滚动到指定位置

1.基本介绍

Element 接口的 scrollIntoView()方法会滚动元素的父容器，使被调用 scrollIntoView()的元素对用户可见。

2.基本使用

element.scrollIntoView(); // 等同于 element.scrollIntoView(true)
element.scrollIntoView(alignToTop); // Boolean 型参数
element.scrollIntoView(scrollIntoViewOptions); // Object 型参数

• alignToTop可选

• 一个布尔值：

  • 如果为 true，元素的顶端将和其所在滚动区的可视区域的顶端对齐。相应的 scrollIntoViewOptions: {block: "start", inline: "nearest"}。这是这个参数的默认值。
  • 如果为 false，元素的底端将和其所在滚动区的可视区域的底端对齐。相应的 scrollIntoViewOptions: {block: "end", inline: "nearest"}。

• scrollIntoViewOptions 可选 实验性

• 一个包含下列属性的对象：

  • behavior 可选

    定义滚动是立即的还是平滑的动画。该选项是一个字符串，必须采用以下值之一：

    • smooth：滚动应该是平滑的动画。
    • instant：滚动应该通过一次跳跃立刻发生。
    • auto：滚动行为由 scroll-behavior 的计算值决定。

  • block 可选

    定义垂直方向的对齐，start、center、end 或 nearest 之一。默认为 start。

  • inline 可选

    定义水平方向的对齐，start、center、end 或 nearest 之一。默认为 nearest。

无返回值null