js scrollIntoView 滑动问题

功能描述

最近写了一个效果，点击事件中控制当前页面滚动到指定位置。用到scrollIntoView方法：

document.getElementById('lcukCard').scrollIntoView();

问题描述

1、滑动之后时候，页面底部显示超出，且手动滑动的页面向上的时候，滑不到顶部

查阅了文档 发现scrollIntoView() 方法是让当前的元素滚动到浏览器窗口的可视区域内。之前的设计中，用img 标签绝对定位了背景图，如果样式对html 或者 body 设置了高度，导致内容向上移动，底部图片超出。

解决方式

将图片设置成css方式引入，将父元素相对定位一下

background: url("../img/a.png") no-repeat;
background-size: 100% 100%;

2、滑动的时候采用{behavior: 'smooth'},发现安卓手机默认居中，而浏览器默认顶部对齐

解决方式

scrollIntoView()方法的参数是一个对象，属性中的block 定义了滑动之后的对其方式，修改成：

document.getElementById('lcukCard').scrollIntoView({ behavior: 'smooth', block:"start"})