Как применить медиа-запросы к DIV с помощью Javascript или CSS
У меня проблема с веб-приложением, управляемым JavaScript, я хочу, чтобы пользователь изменил размер div с помощью ползунка, но проблема в том, что медиа-запросы CSS не применяются к ширине div, так что есть ли способ использование JavaScript или CSS для применения медиа-запросов CSS по ширине div, а не по ширине всего окна ???
Вам нужно изменить ширину div с помощью js, а не медиа-запроса
Медиа-запросы предназначены для изменения стилей в зависимости от ширины браузера. Вы пытаетесь изменить ширину div на основе ползунка, для которого требуется javascript. Зная это, я предлагаю вам попробовать и вернуться, когда вы столкнетесь с конкретной проблемой с кодом js.
![Безумие обратных вызовов в javascript [JS]](https://i.imgur.com/WsjO6zJb.png)
Ответы 2
В javascript есть свойства innerWidth, innerHeight, outerHeight и outerWidth для объекта window. Для элементов HTML есть offsetHeight и offsetWidth. Вы можете использовать шаблоны в javascript для автоматического изменения размеров width и height в CSS, например:
HTMLElement.style.width = window.innerWidth + 'px'
Трудно сказать, не видя вашего кода. Однако контекстно вы можете просто обновить существующий элемент <style>textContent, чтобы он содержал то, что вам нужно.
Что-то вроде этого:
document.querySelector('style').textContent +=
"@entire window and (inner-width:400px) { div { color: blue; }}"
Очевидно, вам нужно обновить приведенный выше код, чтобы он соответствовал вашему коду (я просто привел синтаксис по существу).
Сообщите мне свои результаты.
Вы неправильно прочитали вопрос, медиа-запрос OP может быть применен к div вместо всей страницы, а это не то, для чего предназначены медиа-запросы.
@Huangism О, я понимаю - я не считал, что OP был ориентирован на применение к DIV - да, конечно, медиа-запросы не предназначены для этой цели ... Спасибо за отзыв!
Можете ли вы опубликовать код, его сложно понять без кода