Веб-разработка зачастую требует получения информации о размерах окна браузера, всего экрана и текущей веб-страницы. Это может быть полезно для определения разрешения экрана, для адаптивного дизайна, для создания модальных окон или слайдеров, для работы с прокруткой страницы и других задач.
Получение размеров окна браузера
Размеры окна браузера можно получить с помощью свойств innerWidth и innerHeight объекта window. Они содержат ширину и высоту области просмотра, включая полосы прокрутки.
let windowWidth = window.innerWidth; let windowHeight = window.innerHeight;
Получение размеров экрана
Для получения размеров всего экрана, а не только окна браузера, используются свойства screen.width и screen.height.
let screenWidth = screen.width; let screenHeight = screen.height;
Получение размеров веб-страницы
Размеры веб-страницы, отображаемой в текущем окне браузера, можно получить с помощью свойств clientWidth и clientHeight объекта document.documentElement.
let pageWidth = document.documentElement.clientWidth; let pageHeight = document.documentElement.clientHeight;
Получение текущей позиции прокрутки страницы
Позиция прокрутки страницы в горизонтальном и вертикальном направлениях может быть получена с помощью свойств pageXOffset и pageYOffset объекта window.
let pageX = window.pageXOffset; let pageY = window.pageYOffset;
Получение позиции страницы относительно экрана
Позиция страницы относительно экрана может быть получена с помощью свойств screenX и screenY объекта window.
let screenX = window.screenX; let screenY = window.screenY;
Все указанные свойства работают во всех основных браузерах. Они позволяют получить всю необходимую информацию о размерах и позиции экрана, окна браузера и веб-страницы.
Добавить комментарий