Using history.js come to the same scroll position when we click back button

Question

I want to implement a functionality wherein on clicking the back button, i come back to the same position. A good example may be any ecommerce site.When we scroll down and hit on a product, and click back from the product page, we should reach the same position of the page where that product is.

We use history.js to look up for hashchange and pushstate to save the entries. But when I click on back button , it loads to the top of the page rather than the item scroll position. Also, we are laoding the data using AJAX mostly

Im fairly new to jquery, ajax and so do not know how to set the scroll position, save and load during back button click.

Any help would be great!

Thanks

Answer 1

I recently implemented something like this using $(document).scrollTop() and storing that figure in a cookie when leaving the page. My usecase was non-ajaxy but the same idea could easily be adapted with History.js's events replacing page load events, and no need to bother with the cookie for persistence; as @Kyle above mentioned in his comments, History.js lets you store data with pushState that is returned when you return back to that state.

See jQuery's docs: http://api.jquery.com/scrolltop/