リロードでスクロールがリセットされるかテスト

リロードでスクロールがリセットされるかテストするためのコード。

・History: scrollRestoration プロパティ - Web API | MDN
https://developer.mozilla.org/ja/docs/Web/API/History/scrollRestoration

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>リロードでスクロールがリセットされるかテスト</title>
<script>
if (history.scrollRestoration) {
//  history.scrollRestoration = 'manual'; //Firefoxはmanualにしないとリセットされない。
//  history.scrollRestoration = 'auto'; //Edgeはautoにしてもdiv内はリセットされる。
}
</script>
</head>
<body>
<div style="width:300px; height:100px; overflow-y:scroll;">
<p>1</p>
<p>2</p>
<p>3</p>
<p>4</p>
<p>5</p>
<p>6</p>
<p>7</p>
<p>8</p>
<p>9</p>
<p>10</p>
</div>
<div style="margin-top:800px;">
bodyをスクロールさせる
</div>
</body>
</html>

切り替えるためのブックマークレットのコード

 javascript:(function(){if (history.scrollRestoration=='manual') {history.scrollRestoration='auto';}else{history.scrollRestoration='manual';}})(); 

確認するためのブックマークレットのコード

javascript:(function(){alert(history.scrollRestoration);})();


 

コメント