На сайте есть слайдер.
Для desktop разрешения есть функция desctopSlider()
, которая создает пару кнопок назад/вперед и таким образом его переключает.
Еще есть функция mobileSlider()
, которая уже по результатам считывания touchstart
и touchend
переключает этот же слайдер.
Я могу узнать ширину экрана создав переменную:
let resolution = window.innerWidth
и написать что то подобное:
document.addEventListener("DOMContentLoaded", () => {
let resolution = window.innerWidth
if (resolution >= 991) { // Примерно так
desctopSlider();
} else {
mobileSlider();
}
});
Но я понимаю, что если на ПК баловаться через консоль с разрешением экрана, то режимы слайдеров не будут переключаться.
Если изначально был экран выше 991px
, то слайдер так и останется с кнопками переключений.
Если же уменьшить экран до значения ниже этого брейкпоинта и перезагрузить страницу, то будет задействована мобильная версия слайдера и уже увеличение экрана не вернет ничего обратно.
Лишь перезагрузка страницы поможет тогда.
Вопрос: нужно ли вообще продумывать динамическое переключение функционала сайта в зависимости от разрешения экрана или это лишние извращения?
Если нужно, то каким образом?