Рассмотрим два способа как выполнить 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-дерева.
jQuery(($) => {
if ($(window).width() > 992) {
}
});
Выполнение js в зависимости от высоты экрана
Аналогичным образом можно выполнять JavaScript в зависимости от высоты экрана.
if (document.documentElement.clientHeight < 576) {
}
jQuery:
if ($(window).height() > 1600) {
}
Полезные ссылки:
- Подключение jQuery.
- Шпаргалка по использованию jQuery.