Как отследить величину скрола и передать на другую страницу?

Question

[Филипп Гаврилов]

1. Допустим, я нахожусь на странице, проскроленной на N пикселей.
2. Нажимаю ссылку и попадаю на новую страницу.

Возможно ли сделать, чтобы новая страница открылась сразу проскроленной на те самые N пикселей?

Answer 1

[Stalker_RED]

$('a').on('click', function(){ // на всех ссылках при клике
  let scroll = $(window).scrollTop() // получаем величину скролла
  // дописываем ее в конец ссылки
  let newHref  = $(this).attr('href') + '#' + scroll 
  $(this).attr('href', newHref)
})

а на новой странице при загрузке проверяем location.hash и прокручиваем страницу на сколько нужно.

Это только набросок, до рабочего примера нужно будет допиливать.

Answer 2

[olezhenka]

Если будет полная перезагрузка страниц, используйте что-то из этого:
При переходе на другую страницу передавать данные в адресной строке.
Сохранять в куки или локальное хранилище.

Comments

[Klein Maximus]

Куки или хранилище - плохо. Они могут остаться и вылезти в неподходящий момент. Или тогда привязываться к конкретной сессии.
Лучше всё передавать в URL.

Answer 3

[Klein Maximus]

Как вариант, во время скролла у всех ссылок на странице добавлять хэш со значением прокрутки, а при открытии другой страницы скроллить вниз. Другой вариант, слушать собитие click на ссылке, перехватывать его, "превентить", а отправлять кастомно на адрес с хешем, как в предыдущем варианте. Соответственно, новая страница должна уметь делать скролл к указанному значению.
Это если серверный рендеринг. Если SPA, то сильно зависит от архитектуры.