web-dev-qa-db-ja.com

スクロールバーの位置を変更する

ユーザーがWebページを下にスクロールして特定のポイントに到達したときにスクロールバーの位置を変更することはできますか?たとえば、ページの下半分に達すると、スクロールバーが自動的に最上部に戻ります。

23
alan

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); 
     } 
   }; 
};

私の例 here を確認できます。

31
CMS

うん、何度か見たことがあります。ここにいくつかのJSコードがあります:

window.scrollBy(0,50)

50はスクロールしたいピクセルの量です。

12
thedayturns

気になるスクロール関数は、window.scroll(x,y)window.scrollBy(dx,dy)window.scrollTo(x,y)の3つです。

デビッドが述べたように、あなたがどこにいるかを知るためにスクロール位置が必要であり、window.onscrollイベント。この計算を開始します。

4
Eric Wendelin

(window.pageYOffset || document.body.scrollTop || document.documentElement.scrollTop)は、ほぼすべてのブラウザーで現在のスクロール位置を取得する必要があります。

2
David