jQuery - move to a specific element location jQuery - move to a specific element location ajax ajax

jQuery - move to a specific element location


You need to find the position of the element and scroll to that position each time the height changes. Something like:

var p = $(".links").position();$(window).scrollTop(p.top);


To make the page transparently appear to stay in the same place, you'll need to find out where the links are before you load in the new content.

var before = $(".links").offset().top;

Then after the new content is loaded, get the link's new height.

var after = $(".links").offset().top;

Then do the math to find out how much it's moved.

var difference = after - before

And update your window's scroll location accordingly

$(window).scrollTop( $(window).scrollTop() + difference )


You can probably fix this without jQuery or javascript... Just create a named anchor where you want the top of the page to be after the user clicks the navigation links, put the name of the anchor in the fragment identifier of the nav links, and don't cancel the event so the page navigates to the anchor.

<a name="contentTop"></a>[content]<a href="#contentTop" onclick="nextPage(); return true;">Next</a>