как определить размеры окна браузера в javascript

год назад

Nikolai Gagarinov

Присоединяйтесь к нашему Telegram-сообществу

Ответы

Для определения размеров окна браузера в JavaScript вы можете использовать объект window в браузере. Существует несколько свойств объекта window, которые позволяют получить информацию о размерах окна.

window.innerWidth, window.innerHeight: эти свойства возвращают ширину и высоту окна просмотра в пикселях.

const windowWidth = window.innerWidth;
const windowHeight = window.innerHeight;

console.log(`Ширина окна: ${windowWidth}px`);
console.log(`Высота окна: ${windowHeight}px`);

window.outerWidth, window.outerHeight: эти свойства возвращают внешние размеры окна браузера, включая рамки и панель инструментов.

const windowOuterWidth = window.outerWidth;
const windowOuterHeight = window.outerHeight;

console.log(`Внешняя ширина окна: ${windowOuterWidth}px`);
console.log(`Внешняя высота окна: ${windowOuterHeight}px`);

window.document.documentElement.clientWidth, window.document.documentElement.clientHeight: эти свойства возвращают ширину и высоту содержимого документа в окне браузера без учета полосы прокрутки.

const documentWidth = window.document.documentElement.clientWidth;
const documentHeight = window.document.documentElement.clientHeight;

console.log(`Ширина содержимого: ${documentWidth}px`);
console.log(`Высота содержимого: ${documentHeight}px`);

window.screen.availWidth, window.screen.availHeight: эти свойства возвращают доступное пространство на экране, учитывая панель задач и другие элементы интерфейса.

const screenWidth = window.screen.availWidth;
const screenHeight = window.screen.availHeight;

console.log(`Доступная ширина экрана: ${screenWidth}px`);
console.log(`Доступная высота экрана: ${screenHeight}px`);

5 месяцев назад

Maksim Litvinov

1 месяц

Основы JavaScript

Синтаксис, основы программирования, переменные, строки, арифметика, условные конструкции, циклы, функции, модули

10 месяцев

Фронтенд-разработчик

Верстка на HTML5 и CSS3, Программирование на JavaScript в браузере, разработка клиентских приложений используя React

2 месяца

ООП на Javascript

Навык глубокого понимания архитектуры и написания чистого кода, позволяющий решать сложные задачи

1 месяц

СИКП на JS

Навык понимать программы на фундаментальном уровне, уверенно проходить собеседования и решать сложные задачи

1 месяц

Асинхронное программирование на JS

Навык асинхронного программирования в JavaScript: писать быстрый код, расти в грейде и успешно проходить собеседования.

Похожие вопросы