Как предотвратить загрузку таблицы стилей в мобильных устройствах

Я хочу предотвратить серию анимаций, происходящих в смартфонах и планшетах. Самое простое решение, которое я могу придумать, - просто переместить эти анимации CSS в отдельную таблицу стилей и каким-то образом предотвратить загрузку этой таблицы стилей во всех смартфонах и планшетах.Как предотвратить загрузку таблицы стилей в мобильных устройствах

Как я могу это достичь?

UPDATE:

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

источник

2015-05-28 David Martins

Вы можете обернуть оскорбительный CSS в media query, за исключением небольших устройств.

источник

2015-05-28 11:05:51

Большое спасибо. Я просто не думаю, что медиа-запросы являются лучшим решением для этого, так как некоторые планшеты имеют такой же широкий экран, как некоторые ноутбуки. Я думаю, что решение для этого должно быть чем-то вроде «navigator.platform» или «user agent», но я не знаком с их использованием. –

Вы можете использовать медиазапросы в вашем CSS http://www.w3schools.com/cssref/css3_pr_mediaquery.asp

EG:

@media only screen and (max-width:991px){ 
    /*insert here all the css you want to be load ONLY on devices below 991px*/ 
}

Если вы хотите разделить CSS на двух листах, то вы можете установить это в <head> тег:

<link href="exmaple.css" media="(min-width: 991px)" rel="stylesheet" type="text/css" />

EDIT:

В вашем случае, опция для установки медиа-запроса, как этот:

@media only screen and (min-width:1200px){ 
/*insert here those CSS animations.*/ 
/*they will only take effect on devices above 1200px*/ 
}

Конечно, вы можете установить любое разрешение и использование мин-ширину и максимальный ширин как хотите.

источник

2015-05-28 11:07:07

@DavidMartins. Затем вы можете использовать некоторую библиотеку как Modernizr для обнаружения, это устройство осязаемо или нет. http://modernizr.com/ –

Большое спасибо Наньчо. Я просто не думаю, что медиа-запросы являются лучшим решением для этого, так как некоторые планшеты имеют такой же широкий экран, как некоторые ноутбуки. Я думаю, что решение для этого должно быть чем-то вроде «navigator.platform» или «user agent», но я не знаком с их использованием. –

@DavidMartins Взгляните на комментарий выше вас. –

Как предотвратить загрузку таблицы стилей в мобильных устройствах

ответ

Смежные вопросы