Window.scrollX
Baseline Widely available
This feature is well established and works across many devices and browser versions. It’s been available across browsers since September 2020.
scrollX
— свойство только для чтения интерфейса Window
. Возвращает число пикселей, на которое документ пролистали в данный момент по горизонтали. В современных браузерах это значение является точным числом субпикселей, что означает отсутствие необходимости в полном значении количества пикселей. Вы можете получить количество пикселей, пролистанных по вертикали с помощью свойства scrollY
.
Синтаксис
var x = window.scrollX;
Value
Возвращаемое значение является числом с плавающей точкой двойной точности, показывающее количество пикселей в документе, которые были пролистаны на данный момент от начальной позиции, где положительное значение означает, что контент был пролистан налево. Если документ был просматривается на устройстве с возможностью вычислять точное число субпикселей, то возвращаемое значение также является точным количеством субпикселей и может иметь десятичную часть. Если контент не был пролистан ни в одну из сторон по X, то scrollX
= 0.
Примечание:
Если вам нужно получить целочисленное значение, используйте Math.round()
для округления.
Говоря технически, то scrollX
возвращает X-координату от верхнего края текущего окна просмотра (viewport). Если окна просмотра нет, то возвращаемое значение = 0.
Пример
В данном примере проверяется текущая горизонтальная позиция пролистывания текущего документа. Если это число больше 400 пикселей, то окно пролистывается к началу.
if (window.scrollX > 400) {
window.scroll(0, 0);
}
Примечания
Свойство pageXOffset
- другое название свойства scrollX
:
window.pageXOffset == window.scrollX; // всегда верно
Для кросс-браузерной совместимости используйте window.pageXOffset
вместо window.scrollX
. Кроме того, старые версии Internet Explorer (<9) не поддерживают оба свойства. Для работы в Internet Explorer необходимо использовать нестандарные свойства. Пример полностью совместимого со всеми браузерами кода:
var x =
window.pageXOffset !== undefined
? window.pageXOffset
: (document.documentElement || document.body.parentNode || document.body)
.scrollLeft;
var y =
window.pageYOffset !== undefined
? window.pageYOffset
: (document.documentElement || document.body.parentNode || document.body)
.scrollTop;
Спецификации
Specification |
---|
CSSOM View Module # dom-window-scrollx |
Совместимость с браузерами
BCD tables only load in the browser