현재 웹 페이지 스크롤 위치를 가져오고 설정하려면 어떻게해야합니까?
사용자 작업 / 입력에 따라 새로 고쳐야하는 긴 형식이 있습니다. 이런 일이 발생하면 페이지가 맨 위로 재설정되어 사용자가 원래 있던 지점까지 다시 스크롤해야하기 때문에 사용자를 짜증나게합니다.
페이지가 다시로드되기 전에 현재 스크롤 위치 (숨겨진 입력)를 캡처 할 수 있다면 다시로드 한 후 다시 설정할 수 있습니다.
현재 웹 페이지 스크롤 위치를 가져오고 설정하려면 어떻게해야합니까?
사용자 작업 / 입력에 따라 새로 고쳐야하는 긴 형식이 있습니다. 이런 일이 발생하면 페이지가 맨 위로 재설정되어 사용자가 원래 있던 지점까지 다시 스크롤해야하기 때문에 사용자를 짜증나게합니다.
페이지가 다시로드되기 전에 현재 스크롤 위치 (숨겨진 입력)를 캡처 할 수 있다면 다시로드 한 후 다시 설정할 수 있습니다.
답변:
당신은 document.documentElement.scrollTop부동산을 찾고 있습니다.
getScrollingPosition()숨겨진 변수의 값을 저장합니다. 그런 다음 새로 고친 페이지의 html에서를 사용합니다 <body onLoad="window.scrollTo(x,y). 여기서 x와 y는 숨겨진 값 값의 값입니다!
document.documentElement.scrollTop항상 0을 반환 한다는 것을 발견 document.body.scrollTop했습니다. 그러나 작동하는 것 같습니다. 우분투 한 파이어 폭스, 다른 한편으로는, 반대는 사실이다 - 당신과 함께 공을 얻을 수 body와 함께 정확한 양 documentElement. 무엇을 제공하는지 아십니까?
scrollTop속성이 모든 브라우저에서 작동하지 않으므로이 답변은 정확 하지 않습니다. 더 나은 결과를 확인 window.pageXOffset하고 확인하십시오 window.pageYOffset.
현재 허용되는 답변이 잘못 document.documentElement.scrollTop되었습니다. Chrome에서는 항상 0을 반환합니다. WebKit은 body스크롤을 추적하는 데 사용 하는 반면 Firefox와 IE는 html.
현재 위치를 얻으려면 다음을 원합니다.
document.documentElement.scrollTop || document.body.scrollTop
다음과 같이 현재 위치를 페이지 아래로 1000px로 설정할 수 있습니다.
document.documentElement.scrollTop = document.body.scrollTop = 1000;
또는 jQuery를 사용합니다 (해당하는 동안 애니메이션화하십시오!).
$("html, body").animate({ scrollTop: "1000px" });
window.pageYOffset경우 window.scrollBy()또는 window.scrollTo()방법을 사용하는 것이 더 깨끗 합니다.
브라우저가 현재 창 스크롤 좌표를 표시하는 방법에 약간의 불일치가 있습니다. 구글 크롬 의 맥 과 아이폰 OS는 항상 반환하는 것 0사용하는 경우 document.documentElement.scrollTop또는 jQuery의 $(window).scrollTop().
그러나 다음과 일관되게 작동합니다.
// horizontal scrolling amount
window.pageXOffset
// vertical scrolling amount
window.pageYOffset
HTML5 로컬 스토리지 솔루션을 사용했습니다 ... 모든 링크는 window.location을 변경하기 전에이를 설정하는 함수를 호출합니다.
localStorage.topper = document.body.scrollTop;
각 페이지에는 본문의 onLoad에 다음이 있습니다.
if(localStorage.topper > 0){
window.scrollTo(0,localStorage.topper);
}