Меню
×
   ❮     
HTML CSS JAVASCRIPT SQL PYTHON PHP КАК СДЕЛАТЬ
     ❯   

JS Справочник


JavaScript

Модификаторы: Группы: Метасимволы: Квантификаторы: Свойства: Методы:

Window


HTML DOM


HTML События


Web APIs


HTML Объекты


Другие ссылки




JavaScript Window scrollX



Свойство scrollX

Пример scrollX

Прокрутите содержимое на 100 пикселей и включите scrollX и scrollY:

window.scrollBy(100, 100);
alert(window.scrollX + window.scrollY);
Попробуйте сами »

Ещё примеры ниже.


Описание scrollX

Свойство scrollX возвращает количество пикселей, на которое документ прокручен из верхнего левого угла окна.

Свойство scrollX доступно только для чтения.

Примечание scrollX

Свойство scrollX равно свойству pageXOffset.

Для кроссбраузерной совместимости используйте window.pageXOffset вместо window.scrollX.

Похожи на scrollX

Свойство pageXOffset

Свойство pageYOffset


Синтаксис scrollX

window.scrollX
или просто:
scrollX

Возвращаемое значение scrollX

Тип Описание
NumberКоличество пикселей, на которое прокручен документ от верхнего левого угла окна.


Ещё примеры scrollX

Создайте липкую панель навигации:

// Получить навигационную панель
const navbar = document.getElementById("navbar");

// Получить смещение позиции навигационной панели
const sticky = navbar.offsetTop;

// Добавьте липкий класс к навигационной панели, когда вы достигнете ее позиции прокрутки. Удалите липкий класс, когда вы покинете позицию прокрутки.
function myFunction() {
  if (window.scrollY >= sticky) {
    navbar.classList.add("sticky")
  } else {
    navbar.classList.remove("sticky");
  }
}
Попробуйте сами »

Поддержка браузера scrollX

window.scrollX поддерживается во всех браузерах:

Chrome Edge Firefox Safari Opera IE
Да Да Да Да Да 9-11


×

Связаться с отделом продаж

Если вы хотите использовать услуги schoolsw3 как образовательное учреждение, команда или предприятие, отправьте нам электронное письмо:
sales@schoolsw3.com

Сообщить об ошибке

Если вы хотите сообщить об ошибке или внести предложение, отправьте нам электронное письмо:
help@schoolsw3.com

Schoolsw3 оптимизирован для обучения и подготовки. Примеры могут быть упрощены для улучшения чтения и обучения. Учебники, ссылки и примеры постоянно проверяются, чтобы избежать ошибок, но мы не можем гарантировать полную правильность всего контента.
При использовании Schoolsw3 вы соглашаетесь прочитать и принять наши условия использования,
политику использования файлов cookie и конфиденциальности.

Авторское право 1999- © Copyright. Все права защищены. Schoolsw3 работает на SW3.CSS.