Search code examples
htmljquery-pluginsback-buttonscroller

Back button and a custom scroller, why aren't they acting the same on two webpages?

I am using the malihu custom scroller on a website, and I can not figure why it doesn't react the same way in the demo and on my website.

demo
website

Steps :

  1. Scroll down one custom scroller (doesn't matter how much)
  2. Go to another website or click on a link
  3. Hit the 'Back' button

Demo : goes back to where it was.
Website : goes back to top of list

Deactivating the custom scroller plugin solve this specific issue.

Any idea why?

Solution

  • I tested this on the following browsers:

    • IE9
    • Chrome 35
    • FF 30 (Same as OP)

    As the OP said, this only works on FF.

    FF has a feature called Back-Forward Cache which remembers the entire state of the page, even the js states. This occurs for the duration the browser stays open. You can read more about it here.

    If you don't want to have this occur for experience reasons, there are other posts about it on stackoverflow.

    Update

    If you read the documentation for the Back-Forward Cache, it states that it won't work if you have the Cache-Control: no-cache response headers, which you do have enabled.

    Caching disabled

    This is causing the browser to get fresh data each time instead of caching images and pages locally for faster browsing on later visits.