¿Obtener la posición de desplazamiento actual y pasarla como una variable con un enlace?

Question

Seré honesto, estoy muy lejos de mi profundidad aquí. He creado un sistema de paginación donde hace clic en un enlace, vuelve a cargar la página y se muestra una cierta cantidad de elementos de la lista en una lista desordenada. Al hacer clic de nuevo, volverá a cargar la página y se mostrarán más elementos. Piensa cómo Twitter muestra los tweets en tu feed.

El problema es que cuando vuelve a cargar la página permanece en la parte superior. Lo que me gustaría es que salte a la misma posición en la página que tenía anteriormente.

Ya tengo un selector para el enlace configurado bien. Simplemente no sé cómo obtener la posición de desplazamiento actual y luego pasarla a la nueva página para que salte.

Aquí está mi código hasta ahora:

jQuery(document).ready(function(){
    $("a[rel=more]").live("click", function(){
        //script...
    });
});

¿A dónde voy desde aquí?

Answer 1

1. Vuelva a cargar los elementos utilizando AJAX en lugar de volver a cargar toda la página.

2. Obtenga y establezca la posición de desplazamiento utilizando window.pageYOffset y window.scrollTo (0, y) .

   Guardaría la posición en el hash de la URL:

   // after loading the document, scroll to the right position
   // maybe location.hash has to be converted to a number first
   $(document).ready(function() {
       window.scrollTo(0, location.hash);
   });
   
   // I'm not quite sure if reload() does preserve the hash tag.
   location.hash = window.pageYOffset;
   location.reload();
   

Answer 2

Como dijo gs, agregue los elementos a través de una llamada ajax en lugar de volver a cargar la página.

Si no desea utilizar el jQuery.ScrollTo enchufar. Que admite todo lo relacionado con el desplazamiento con el que podría haber soñado

Answer 3

Creo que lo que necesitas es pasar un ancla HTML al final de tu enlace. El navegador se desplazará automáticamente al elemento justo al lado del ancla coincidente. Ejemplo:

<a href="page2.html#myanchor">Next page</a>

En algún momento en el medio de la página2:

<a name="myanchor">My item N</a>

Answer 4

según el enlace de @Shawn Grigson, pageYOffset no es compatible de la misma manera en todos los navegadores.

una solución jQuery (espero que sea verdaderamente compatible con todos los navegadores, aunque todavía no lo he probado) para obtener y configurar el desplazamiento vertical de un elemento es scrollTop () .