Nhận vị trí cuộn hiện tại và chuyển nó dưới dạng biến với một liên kết?

Question

Tôi sẽ thành thật, tôi đã thoát khỏi chiều sâu của mình ở đây. Tôi đã tạo ra một hệ thống phân trang nơi bạn bấm vào một liên kết nó tải lại trang và một số lượng nhất định các mục danh sách được hiển thị trong một danh sách không có thứ tự. Khi bạn nhấp vào nó một lần nữa nó sẽ tải lại trang và nhiều mặt hàng hiển thị. Hãy suy nghĩ cách Twitter hiển thị các tweet trong nguồn cấp dữ liệu của bạn.

Vấn đề là khi tải lại trang ở lại trên cùng. Những gì tôi muốn là cho nó để nhảy đến vị trí tương tự trên trang nó trước đó đã có.

Tôi đã có bộ chọn cho liên kết được thiết lập tốt Tôi chỉ không biết cách lấy vị trí cuộn hiện tại và sau đó chuyển nó tới trang mới để chuyển đến.

Dưới đây là mã của tôi cho đến nay:

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

Nơi nào tôi đi từ đây?

Answer 1

1. Tải lại các mục bằng AJAX thay vì tải lại toàn bộ trang.

2. Tải và đặt vị trí cuộn bằng cách sử dụng window.pageYOffset và window.scrollTo(0, y).

   tôi muốn lưu trữ vị trí trong các hash của 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

Như gs cho biết thêm các yếu tố thông qua một cuộc gọi ajax thay vì của tải lại trang.

Nếu bạn không muốn sử dụng plugin jQuery.ScrollTo. Hỗ trợ mọi thứ liên quan đến cuộn bạn có thể mơ ước về

Answer 3

theo liên kết @Shawn Grigson, pageYOffset không được hỗ trợ giống nhau trên tất cả các trình duyệt.

giải pháp jQuery (hy vọng thực sự tương thích trình duyệt chéo, mặc dù tôi chưa thử nghiệm) để nhận và thiết lập cuộn dọc của phần tử là scrollTop().

Answer 4

Tôi nghĩ những gì bạn cần chỉ là để vượt qua một neo HTML ở cuối liên kết của bạn. Trình duyệt sẽ tự động cuộn đến phần tử ngay bên cạnh neo phù hợp. Ví dụ:

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

Tại một số điểm ở giữa page2:

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