Holen Sie sich aktuelle Bildlaufposition und gibt es als eine Variable mit einem Link?

Question

Ich will ehrlich sein, ich bin Art und Weise aus meiner Tiefe hier. Ich habe eine Paginierung System geschaffen, in dem Sie auf einen Link klicken, um es die Seite neu geladen und eine bestimmte Anzahl von Listenelementen sind in einer ungeordneten Liste angezeigt. Wenn Sie es noch einmal klicken, wird es die Seite und mehr Einzelteile nachladen zeigt. Denken Sie, wie Twitter die Tweets in Ihrem Feed zeigt.

Das Problem ist, wenn es die Seite neu lädt es an der Spitze bleibt. Was ich möchte, ist es an der gleichen Position auf der Seite zu springen hatte zuvor.

Ich habe bereits einen Wähler für den Link Geldbuße bis ich weiß einfach nicht, wie die aktuelle Bildlaufposition zu erhalten und es dann auf die neue Seite übergeben, dafür zu springen.

Hier ist mein Code so weit:

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

Wohin gehe ich von hier aus?

Answer 1

1. neu laden Sie die Elemente mit AJAX, anstatt die ganze Seite neu geladen wird.

2. Get und stellen Sie die Bildlaufposition window.pageYOffset und window.scrollTo(0, y) verwendet wird.

   Ich würde speichern die Position in der Hash-Wert des 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

Wie gs sagte die Elemente über einen Ajax-Aufruf hinzufügen, statt von der Seite neu zu laden.

Wenn Sie nicht möchten, dass die jQuery.ScrollTo Plugin. Welche alles unterstützt im Zusammenhang mit Ihnen Scrollen jemals über

geträumt haben könnte

Answer 3

Ich denke, was Sie brauchen, ist nur ein HTML-Anker am Ende Ihres Link zu übergeben. Der Browser scrollt automatisch auf das Element direkt neben dem angepassten Anker. Beispiel:

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

An einem gewissen Punkt in der Mitte des page2:

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

Answer 4

nach @Shawn Grigson des Link wird pageYOffset nicht das gleiche in allen Browsern unterstützt wird.

eine jQuery-Lösung (hoffentlich wirklich Cross-Browser kompatibel, obwohl ich noch nicht getestet) für das Abrufen und Einstellen eines vertikale Scroll des Elements ist scrollTop () .