Как задать media queries только для планшетов и смартфонов без привязки к разрешению?

Question

[make_dev]

Добрый день!
Подскажите, пожалуйста, как задать media queries только для планшетов и смартфонов без привязки к разрешению экрана?
У меня на сайте есть параллакс в баннере, который мне нужно отключать на всех планшетах/смартфонах.
Если я буду привязываться к разрешению - то как запретить параллакс именно для телефонов и планшетов с разрешением 1920*1080?

Подойдут ли медиа, набодобие таких?

@media (min-device-width: 800px) and (max-device-width: 1280px) {
    ......
}

Спасибо!

Comments

[Ankhena]

Откройте https://www.esolutions.se/en-GB/test на планшете и смартфоне.
Узнаете, что вьюпорт у них совсем не 1920х1080.
Соответственно и с media проблем не будет.

Либо пользуйтесь библиотекой, которая определяет устройства. Только это уже без media будет.

Answer 1

[prodavec macdonalds]

https://ruseller.com/lessons.php?rub=32&id=1896

Answer 2

[Михаил Макаров]

Не существует, к сожалению, в медиа запросах механизма для определения, мобильное ли устройство используется или десктоп. Можно лишь косвенно по разрешениям экрана определять, что за девайс перед тобой. Хорошая подборка на все случаи жизни есть, например, вот тут https://css-tricks.com/snippets/css/media-queries-...

Answer 3

[maxsnw]

че используешь? фулпейдж.жс? если так то там есть свойства респонсив хайт и респонсив витз для отключения параллакса. Да и зачем запрещать телефонам и планшетам с таким огромным разрешением? они ведь будут в состоянии нормально его отобразить и пролистать. Поэтому есть смысл ориентироваться на максимально допустимую ширину или высоту при которой отрубать параллакс, когда контент уже начинает плыть.