jquery prepend moving page

Question

I have a div that contains several lists (uls) of a box, in each box has an image and a description. I am implementing an infinite bearing upward as follows:

• The user accesses a specific page (ex page 6), each page has 5 pages.
  
• when the page is scrolled up a new page is loaded by ajax, bringing up 5 more uls and being inserted into html by a prepend.
  

Before loading the first ul had id 'ul30', after loading the first ul has id 'ul25'.

When I give the prepend the page rolls the screen up to ul25. How can I maintain the original position (ul30)?

*Note: I tried to make an animation using $(). Animate() at the end of the ajax Success to ul30, but since the boxes have images, which take a while to load, the position passed to the Animate is not yet the final position (the browser is still mounting the page) so it is in a position between ul25 and ul30

*Obs2: I cannot set a fixed size for the images via css, even if I have a registered image size pattern (these can be changed later)

[EDIT]

In example of the implementation I want to do is facebook, when it is on Timeline and new stories are loaded, the position of the screen is not changed, but an html content is inserted at the beginning of the Timeline element.

Answer 1

Pilati, a simple solution to your case, is to jump to the current element.

var url = location.href;               //Armazene a URL sem o #
var topo = "ul30";                     //id do elemento que você quer exibir no topo
location.href = "#" + topo;            //Para mover o scroll para o elemento desejado.
history.replaceState(null,null,url);   //removendo o # da URL.