Выполнение js в зависимости от ширины экрана

Рассмотрим два способа как выполнить js код в зависимости от ширины экрана, а затем и высоты. 1 способ - с помощью нативного js, 2 способ - используя jQuery.

1 способ - нативный JavaScript.

Выполнение js кода на экранах шириной более 768px.

if (document.documentElement.clientWidth > 768) {

}

Пример: если разрешение экрана меньше 1200px - выполнение одного кода.

Если разрешение больше 1200px - другого.

if (document.documentElement.clientWidth < 1200) {

} else {

};

2 способ - с помощью jQuery.

Выполнение JavaScript кода на разрешениях более 992px после загрузки DOM-дерева.

$(function(){
  if ( $(window).width() > 992 ) {

  }
});

Выполнение js в зависимости от высоты экрана

Аналогичным образом можно выполнять JavaScript в зависимости от высоты экрана.

if (document.documentElement.clientHeight < 576) {

}

jQuery

if ( $(window).height() > 1600 ) {

}

Полезные ссылки

  • Подключение jQuery
  • Шпаргалка по использованию jQuery
admin