首页 > 解决方案 > .scrollIntoView 将页面稍微向左移动

问题描述

我安装了一个.scrollIntoView元素并指定了内容必须滚动到的位置,即 . 但是,当我在网站上对其进行测试时,单击触发scrollIntoView功能的按钮后,该功能运行良好,它滚动到所需位置并显示包含它的所有内容,但整个页面略微向左移动。

注意:在桌面上不是很明显,但在移动设备或平板电脑上很明显左侧大约 10% 的内容从屏幕上被剪掉了)。

关于如何防止整个页面向左移动的任何想法?


.

  <div class="scrolltohere"></div>



<script>
function myFunction() {
  var elmnt = document.getElementsByClassName("scrolltohere");
  elmnt[0].scrollIntoView({behavior: "smooth", block: "start", inline: "start"}); 
}
</script>

标签: javascripthtmlcss

解决方案


我得到了答案,所以基本上问题是内联被设置为“开始”,删除它或将其更改为“最近”解决了页面向左移动的问题。

从此改变

  elmnt[0].scrollIntoView({behavior: "smooth", block: "start", inline: "start"}); 

对此

elmnt[0].scrollIntoView({behavior: "smooth", block: "start", inline: "nearest"});

推荐阅读