javascript - 如何更改滚动条位置？

Question

当用户向下滚动网页到达某个点时，是否可以更改滚动条位置？例如，一旦您向下到达页面的一半，滚动条就会自动移回顶部。

Answer 1

您可以使用onscroll事件计算滚动条当前位置的百分比，如果达到 50 %，则可以使用scrollTo函数将滚动位置设置为页面顶部：

window.onload = function () { 
  window.onscroll = function () { 
    var doc = document.body, 
    scrollPosition = doc.scrollTop,
    pageSize = (doc.scrollHeight - doc.clientHeight),
    percentageScrolled = Math.floor((scrollPosition / pageSize) * 100); 

     if (percentageScrolled >= 50){ // if the percentage is >= 50, scroll to top
       window.scrollTo(0,0); 
     } 
   }; 
};

你可以在这里查看我的例子。

Answer 2

是的，我已经看过几次了。这是一些JS代码：

window.scrollBy(0,50)

50 是您要滚动的像素数量。

Answer 3

您需要关注的三个滚动功能是window.scroll(x,y)、window.scrollBy(dx,dy)和window.scrollTo(x,y)。

正如大卫所提到的，您需要滚动位置才能知道您在哪里，并使用该window.onscroll事件来启动此计算。

Answer 4

(window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop) 应该为您提供几乎任何浏览器中的当前滚动位置。