Load New Ajax Content Above Current Div Without Scrolling

I'm not sure if I'm allowed to post questions without code here. Anyway, if it's too broad or not appropriate I'll gladly delete. I'm currently in the process of implementing pul

Solution 1:

No, I can't remember a site where there's a system exactly like you describe. But I made a small function that should mimic what you want to achieve pretty well.

Here's a demo where you can see the code live.

How the code works

1). Define the variable that keeps track of the current offset to the top of the document, like this:

var curr_y = $(window).scrollTop();

2). Update the value of the current offset to the top of the document every time the user scrolls:

$(window).scroll(function () {
    curr_y = $(window).scrollTop();
});

3). Use your function to fetch data, and then use this code to prepend to the container and then scroll the page to the place where it used to be before the prepend:

cont = $('<div>your-content');
$("#container").prepend(cont);
$(window).scrollTop(curr_y + cont.outerHeight(true));