2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

戻るボタンを押した時に、ページトップではなく元の位置に戻るようにしたい

Last updated at Posted at 2022-09-18

CMSなど何らかの記事一覧ページがあったとして、
詳細ページに遷移後、また一覧に戻ったときも遷移前のスクロール位置を保持したい。

実装したこと

当初、以下の想定をしていました。

  1. ローカルストレージに遷移前のスクロール位置を保存する。
  2. 戻ったときにそこに移動する。

しかし、History APIが既にその仕様を取り扱っている模様。
history.back()を組み込んであげることで、ブラウザの[←戻る]ボタンを押したときと同じ動作を実現できます。

index.html
<a href="javascript:void(0)" onclick="history.back()">前のページに戻る</a>

参考サイト

History.back()
History.scrollRestoration

2
2
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
2
2

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?