Window 인터페이스의 scrollY 읽기 전용 속성은 문서가 수직으로 얼마나 스크롤됐는지 픽셀 단위로 반환합니다. 최신 브라우저에서는 값의 정밀도가 픽셀보다 작으므로 반드시 정숫값을 반환하는건 아닙니다. 수평 스크롤은 scrollX 속성을 사용하여 가져올 수 있습니다.

구문

var y = window.scrollY

원점으로부터 문서를 수직방향으로 스크롤한 픽셀의 수를 나타내는, 배정밀도 부동소수점 값. 양의 값이 위쪽 스크롤을 의미합니다. 문서를 단일 픽셀보다 높은 정밀도의 장치에서 렌더링한 경우 반환값의 정밀도도 높아져 소숫값을 반환할 수 있습니다. 문서가 위나 아래로 전혀 움직이지 않은 상태면 0을 반환합니다.

정숫값이 필요하면 Math.round()를 사용해 반올림할 수 있습니다.

더 기술적인 용어로, scrollY는 현재 뷰포트 위쪽 모서리의 Y좌표를 반환하고, 뷰포트가 없으면 0을 반환합니다.

예제

// make sure and go down to the second page 
if (window.scrollY) {
  window.scroll(0, 0);  // reset the scroll position to the top left of the document.
}

window.scrollByPages(1);

참고

scrollY 속성을 사용하면 scrollBy(), scrollByLines(), scrollByPages()와 같은 상대적 스크롤 함수를 사용할 때, 문서가 이미 스크롤되지는 않았는지 판별할 수 있습니다.

pageYOffset 속성은 scrollY의 다른 이름입니다.

window.pageYOffset === window.scrollY; // 항상 true

브라우저간 호환성을 위해서는 window.scrollY 대신 window.pageYOffset을 사용하세요. 이에 더해, Internet Explorer 9 미만의 구형 환경에서는 두 속성 모두 지원하지 않으므로 또 다른 비표준 속성을 사용해야 합니다. 다음은 완벽히 호환되는 코드의 예시입니다.

var supportPageOffset = window.pageXOffset !== undefined;
var isCSS1Compat = ((document.compatMode || "") === "CSS1Compat");

var x = supportPageOffset ? window.pageXOffset : isCSS1Compat ? document.documentElement.scrollLeft : document.body.scrollLeft;
var y = supportPageOffset ? window.pageYOffset : isCSS1Compat ? document.documentElement.scrollTop : document.body.scrollTop;

명세

Specification Status Comment
CSS Object Model (CSSOM) View Module
The definition of 'window.scrollY' in that specification.
Working Draft

브라우저 호환성

Update compatibility data on GitHub
DesktopMobile
ChromeEdgeFirefoxInternet ExplorerOperaSafariAndroid webviewChrome for AndroidFirefox for AndroidOpera for AndroidSafari on iOSSamsung Internet
scrollYChrome Full support Yes
Full support Yes
Full support Yes
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Edge Full support Yes
Full support Yes
Full support Yes
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Firefox Full support Yes
Full support Yes
Full support Yes
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
IE No support No
No support No
Full support 9
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Opera Full support Yes
Full support Yes
Full support Yes
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Safari Full support Yes
Full support Yes
Full support Yes
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
WebView Android Full support Yes
Full support Yes
Full support Yes
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Chrome Android Full support Yes
Full support Yes
Full support Yes
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Firefox Android Full support Yes
Full support Yes
Full support Yes
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Opera Android Full support Yes
Full support Yes
?
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Safari iOS Full support Yes
Full support Yes
?
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Samsung Internet Android Full support Yes
Full support Yes
?
Alternate Name
Alternate Name Uses the non-standard name: pageYOffset
Subpixel precisionChrome Full support YesEdge Full support YesFirefox Full support 55IE No support NoOpera Full support YesSafari Full support YesWebView Android Full support YesChrome Android Full support YesFirefox Android Full support 55Opera Android ? Safari iOS ? Samsung Internet Android ?

Legend

Full support  
Full support
No support  
No support
Compatibility unknown  
Compatibility unknown
Uses a non-standard name.
Uses a non-standard name.

같이 보기

문서 태그 및 공헌자

이 페이지의 공헌자: alattalatta, mdnwebdocs-bot, jeonnoej
최종 변경자: alattalatta,