Question

I have a single paged website designed with Jquery and html. I’ve got a div called #site-content which holds all the “pages”, and has a width of 4400px. Page 1 starts at left : 0px;, the second at left : -1100px, the third at left : -2200px, and the fourth at left : -3300px;, on the third page e.g. i get this :

<div id="site-content" style="left: -2200px;">

After refreshing the page, it starts again at left : 0px;.

Is there a way in which I can make sure that it starts again at left : -2200px;??

Code example would be really appriciated,

Thanks in advance,

Answer 1

Try to use anchor-navigation.

This code should work, if url looks like: http://site.com/#1 or something like that.

$(document).ready(function(){
  var anchor = window.location.hash; // not sure about correct getting anchor
  $("#site-content").animate({ left:(1100*anchor)+"px" }, 500);
});