현재 스크롤 위치를 가져 와서 링크와 함께 변수로 전달합니까?

Question

솔직히 말해서 여기서 깊이 빠져 나옵니다. 페이지를 다시로드하는 링크를 클릭하는 페이지 매김 시스템을 만들었고 특정 수의 목록 항목이 변하지 않은 목록에 표시됩니다. 다시 클릭하면 페이지를 다시로드하고 더 많은 항목이 표시됩니다. 트위터가 피드에서 트윗을 어떻게 표시하는지 생각해보십시오.

문제는 상단에 유지되는 페이지를 다시로드 할 때입니다. 내가 원하는 것은 이전에 가지고 있던 페이지의 같은 위치로 점프하는 것입니다.

이미 링크 설정에 대한 선택기가 잘 설정되어 있습니다. 현재 스크롤 위치를 가져 오는 방법을 모르고 새 페이지로 전달하여 점프 할 수 있습니다.

지금까지 내 코드는 다음과 같습니다.

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

여기서 어디로 가야하나요?

Answer 1

1. 전체 페이지를 다시로드하는 대신 ajax를 사용하여 항목을 다시로드하십시오.

2. 스크롤 위치를 사용하여 설정하고 설정하십시오 window.pageYOffset 그리고 window.scrollTo(0, y).

   나는 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

GS가 말했듯이 페이지를 다시로드하는 대신 ajax 호출을 통해 요소를 추가합니다.

사용하고 싶지 않다면 jQuery.scrollto 플러그인. 당신이 꿈꿔 왔던 스크롤과 관련된 모든 것을 지원합니다.

Answer 3

필요한 것은 링크 끝에 HTML 앵커를 통과하는 것이라고 생각합니다. 브라우저는 일치하는 앵커 바로 옆에 요소로 자동으로 스크롤됩니다. 예시:

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

Page2 중간의 어느 시점에서 :

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

Answer 4

@shawn Grigson의 링크에 따르면 Pageyoffset은 모든 브라우저에서 동일하게 지원되지 않습니다.

요소의 수직 스크롤을 얻고 설정하기위한 jQuery 솔루션 (아직 테스트하지는 않았지만 아직 테스트하지는 않았지만 아직 테스트하지는 않았지만) ScrollTop ().