Отключить правило CSS на устройствах с сенсорными экранами - PullRequest
Новая
       7

Отключить правило CSS на устройствах с сенсорными экранами

2 голосов
/ 06 апреля 2019

Я использую этот скрипт на своем веб-сайте:

https://mtekk.us/archives/guides/vista-like-breadcrumbs-for-wordpress/

При наведении мышки на ссылки появляется набор подменю. Это отлично работает, и у меня нет претензий к моему ПК Тем не менее, вы не можете должным образом навести курсор мыши на мобильных устройствах, поэтому я хотел бы отключить отображение подменю на мобильных устройствах.

Есть ли способ обнаружить мобильные устройства, которые не зависят от размеров экрана в пикселях в медиа-запросах? Моя проблема здесь не в размере экрана, а в способе ввода. Спасибо.

1 Ответ

1 голос
/ 06 апреля 2019

Существует новый Медиа-запрос 4-го уровня , который вполне может стать способом сделать это.

Настоящее волшебство - hover: hover, но вот некоторая информация о pointer: fine из MDN :

Основной механизм ввода включает точное указательное устройство.

Вы можете использовать запрос следующим образом: 

@media(hover: hover) and (pointer: fine) {
  .navigation-main ul li:hover>ul {
    display:block;
  }
}

Здесь находится тестовый сайт , где вы можете протестировать новые запросы @media на вашем устройстве..

...