Webkit эквивалент: -moz-system-metric (сенсорный) - PullRequest
7 голосов
/ 30 июля 2010

: - moz-system-metric (с сенсорным управлением) выглядит как действительно полезный селектор CSS для работы на мобильных сайтах.

К сожалению, Webkit доминирует на мобильных сенсорных устройствах, поэтому кто-нибудь знает, существует ли эквивалент Webkit?

(В идеале было бы хорошо, если бы это управлялось медиазапросами CSS3)

Редактировать: Похоже, что он поддерживается в Gecko как медиа-запрос

Ответы [ 3 ]

5 голосов
/ 16 июня 2011

Нет способа сделать это, не прибегая к Javascript, в настоящее время.

Как сказал @easwee, Modernizr - уважаемая библиотека JS, которая фокусируется на обнаружении функций. Вы можете использовать его touch тест для вашего случая использования.

Если вам не нужны все навороты Модернизра, вы можете сделать следующее:

A) Загрузите следующий JS как можно раньше в тег <body>:

<script type="text/javascript">
if( !!window.TouchEvent ) body.className += " touch-enabled ";
</script>

Б) Напишите свой CSS. Поскольку Gecko использует медиазапрос для информирования о доступности сенсорного экрана, вам придется дублировать CSS, специфичный для сенсорного экрана, например:

BODY.touch-enabled DIV.foo
{
    /* touch-specific CSS */
}

@media screen and (-moz-touch-enabled)
{
DIV.foo
{
    /* touch-specific CSS */
}

}

Если код для каждого селектора идентичен в обоих случаях, GZIP должен оптимизировать некоторые дубликаты. (Надеюсь, вы используете сжатие.)

2 голосов
/ 28 октября 2012

В ответе Яна Вессмана тест !!window.TouchEvent работает некорректно.В текущем настольном Chrome (23.0.1271.52, Linux) window.TouchEvent - это функция, поэтому код Яна считает, что браузер поддерживает сенсорное управление.

Если вам нужен короткий код, вероятно, лучше скопировать и вставить соответствующий код от Modernizr .

1 голос
/ 07 апреля 2011

Chrome - еще один браузер, который пытался реализовать подобный селектор, но, к сожалению, на данный момент он удален.

Modernizr может быть интересным инструментом обнаружения, поскольку он также может обнаруживать сенсорные события.

http://www.modernizr.com/docs/#touch

...