JavaScript - Объект screen

На этом уроке мы познакомимся с объектом screen, который может использоваться для получения информации об экране пользователя.

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

window.screen

Для получения различных характеристик экрана пользователя объект screen предоставляет для разработчика JavaScript следующие свойства: screen.width, screen.height, screen.availWidth, screen.availHeight, screen.colorDepth.

Свойства screen.width и screen.height возвращают соответственно ширину и высоту экрана пользователя в пикселях.

Например, вывести в элемент div ширину и высоту экрана пользователя:

<div id="userScreen" class="alert alert-warning"></div>
<script>
var userScreen;
userScreen = "Ширина экрана пользователя: <strong>" + screen.width + "</strong>";
userScreen += "<br />";
userScreen += "Высота экрана пользователя: <strong>" + screen.height + "</strong>";
window.document.getElementById("userScreen").innerHTML = userScreen;
</script>

JavaScript - свойства width и height объекта screen

Свойства screen.availWidth и screen.availHeight возвращают ширину и высоту, которое может занять окно браузера. Например, в операционной системе Windows свойство screen.availHeight равно разнице между высотой экрана и высотой "Панели задач".

Например, вывести в элемент div доступную ширину и высоту экрана пользователя:

<div id="availSizeWindow" class="alert alert-warning"></div>
<script>
var availSizeWindow;
availSizeWindow = "Доступная (свободная) ширина экрана: <strong>" + screen.availWidth + "</strong>";
availSizeWindow += "<br />";
availSizeWindow += " Доступная (свободная) высота экрана: <strong>" + screen.availHeight + "</strong>";
window.document.getElementById("availSizeWindow").innerHTML = availSizeWindow;
</script>

JavaScript - свойства availWidth и availHeight объекта screen

Свойства screen.colorDepth возвращает количество бит, которые требуются для отображения одного цвета.

Например, вывести в элемент div качество цветопередачи устройства пользователя:

<div id="colorDepth" class="alert alert-warning"></div>
<script>
var colorDepth;
colorDepth = "Качество цветопередачи: <strong>" + screen.colorDepth + "</strong>";
window.document.getElementById("colorDepth").innerHTML = colorDepth;
</script>

JavaScript - свойство colorDepth объекта screen



   JavaScript и jQuery 0    1855 0

Комментарии (3)

  1. Дамир # 0
    привет крутые уроки,
    планируешь после курса по JavaScript, написать курс по jQuery и созданию не сложных скриптов для сайта?
    1. Александр Мальцев # 0
      Привет, Дамир.
      Да, после окончания курса по JavaScript, планирую написать курс по jQuery.
      1. Дамир # 0
        класс спс обязательно буду читать
        интересуют небольшие скрипты типа:
        — менюха при скроллинге прикрепляется к верху сайта
        — при скроллинге появляются кнопки вверх/вниз
        — создание своих модальных окон, галерей, слайдеров
        — паралакс,
        — появление картинок при сроллинге
        — счетчик окончания даты и т.д.
        вообщем обычных стандартных вещей которые сейчас юзаются на сайтах.

    Вы должны авторизоваться, чтобы оставлять комментарии.