1. ホーム
  2. javascript

[解決済み] JavaScript/jQueryでページの一番上にスクロールするには?

2022-03-01 09:08:02

質問

JavaScript/jQueryでブラウザのスクロールを制御する方法はありますか?

ページを半分までスクロールしてから再読み込みすると、ページを一番上に戻したいのですが、その代わりに最後のスクロール位置を探そうとします。そこで、次のようにしてみました。

$('document').ready(function() {
   $(window).scrollTop(0);
});

しかし、運が悪い。

EDIT :

ページがロードされた後に呼び出すと、お二人の回答は両方とも機能しました。しかし、ページを更新すると、ブラウザが計算し、古いスクロール位置にスクロールするように見える .ready イベント(ボディのonload()関数もテストしました)。

つまり、ブラウザが過去の位置までスクロールするのを防ぐ方法、または、スクロールした後に一番上まで再スクロールする方法はありますか?

解決方法は?

うわー、9年遅れの質問です。 さあ、どうぞ。

このコードをonloadに追加してください。

// This prevents the page from scrolling down to where it was previously.
if ('scrollRestoration' in history) {
    history.scrollRestoration = 'manual';
}
// This is needed if the user scrolls down during page load and you want to make sure the page is scrolled to the top once it's fully loaded. This has Cross-browser support.
window.scrollTo(0,0);

ウィンドウの読み込み時に実行するには、次のようにラップしてください。 JQuery を参照)

$(function() {
  // put the code here
});

history.scrollRestoration ブラウザ対応。

クローム:対応(46以降)

Firefox: サポートされています(46以降)

エッジ:対応(79年以降)

IEです。 対応しない

オペラ:対応(33以降)

サファリ:対応

について IE 自動でスクロールした後、一番上に再スクロールしたい場合は、この方法でうまくいきました。

var isIE11 = !!window.MSInputMethodContext && !!document.documentMode;
if(isIE11) {
    setTimeout(function(){ window.scrollTo(0, 0); }, 300);  // adjust time according to your page. The better solution would be to possibly tie into some event and trigger once the autoscrolling goes to the top.
}