Return the user back to where they scroll to the previous page when you click the "Back Browser" button

Question

Is it possible to return the user to the area of ​​the page on which they scrolled down when clicking the "Back" button in the browser? As in --- pageA doubles the screen size (so you need to scroll to read more). You will follow the link on page A to go to the new page - pageB. After reading, you will click back in the browser. Now, when you return to page A, you will return to the top and scroll down to where you should continue reading the rest of the page.

Is there a Jquery or JS way to return to this point in the page. Maybe something with .scrollTop ()?

Answer 1

If the content is loaded after firing at the "load" event, the "Back" button will not return you to the position you were in. Because the browser scrolls before the "load" event.

In order for the browser to remember the scroll position at this time, you need to save the scroll location and status (what content was downloaded) somewhere before navigation. Either in the cookie or in the URL hash.

If pageA is a static page with no dynamic content (loaded after the "load" event, the browser must remember the scroll position when you return.

For dynamic content, there are at least two parts. One of them restores the status of the page when it presses the "Back" button, so all dynamic content is loaded, some expanders expand or collapse. Another scroll there.

The first part depends on how the page is implemented. In the second part, you can put the top of the scroll in the cookie when the page does onUnload. for example

$(window).unload(function() {$.cookie('scrollTop',$(window).scrollTop());}); 

Answer 2

You can use the following code to determine the scroll position.

  $(window).scroll(function (event){ var scroll = $(window).scrollTop(); // Do something }); 

Then save the scroll in the session and, when you click back, scrollTop(scroll) .

Answer 3

You can do this using the session store.

 $(window).scroll(function () { //set scroll position in session storage sessionStorage.scrollPos = $(window).scrollTop(); }); var init = function () { //return scroll position in session storage $(window).scrollTop(sessionStorage.scrollPos || 0) }; window.onload = init;