elm.scrollIntoView 方法介绍
2021-04-29 11:37

scrollIntoView

let elem = document.getElementById(key);
if(elem) {
       elem.scrollIntoView({behavior: "smooth"});
}

我们想要实现将页面滚动到固定位置,呈现某些固定元素,之前的做法是先通过getBoundingClientRect来获取目标元素在视窗中的位置,再加上scrollTop值,判断元素距离页面顶端的距离,之后再设置document的scrollTop值三步才能达到目的。

而现在有了scrollIntoView可以一步帮我们实现想要的滚动效果。

scrollIntoView方法的参数可以是true(顶端对其),false(底部对其),或者是一个对象。

behavior:smooth能让其平滑的滚动。


原创文章,转载请注明来自:妹纸前端-www.webfront-js.com.
阅读(609)
辛苦了,打赏喝个咖啡
微信
支付宝
妹纸前端
妹纸前端工作室 | 文章不断更新中
京ICP备16005385号-1