Как определить, присутствуют ли медиазапросы с помощью Modernizr - PullRequest
Новая
       32

Как определить, присутствуют ли медиазапросы с помощью Modernizr

17 голосов
/ 18 сентября 2011

Я пытаюсь определить, присутствуют ли медиа-запросы с использованием Modernizr 2, а затем загружает файл response.js, если необходимо.

Я поместил это в мой файл script.js ... 

Modernizr.load({
  test: Modernizr.mq,
  yep : '',
  nope: 'mylibs/respond.js'
});

Что я делаю не так? Я действительно удивлен, что на сайте Modernizr нет примера того, как это сделать с помощью Media Queries. Вот версия Modernizr, которую я использую ...

http://www.modernizr.com/download/#-backgroundsize-borderradius-boxshadow-iepp-respond-mq-cssclasses-teststyles-testprop-testallprops-prefixes-domprefixes-load

Ответы [ 2 ]

19 голосов
/ 28 сентября 2011

Это потому, что !!Modernizr.mq === true всегда ... вы проверяете не то!

Согласно документам :

Если браузер вообще не поддерживает медиазапросы (например, oldIE), mq () всегда будет возвращать false.

Но это: Modernizr.mq() тоже false! Вы должны на самом деле что-то проверить. Здесь ключевое слово all как раз то, что вам нужно (или only all, как предлагает Павел): 

Modernizr.load({
  test: Modernizr.mq('only all'),
  nope: 'polyfill.js'
});

Однако все пользовательские сборки Modernizr 2.0.x с mq включают response.js , так что вам действительно не нужно проверять это, кроме случаев, когда вы хотите загрузить другую вместо того, чтобы заполнить В этом случае вам нужно будет отключить / удалить response.js из вашей сборки.

Modernizr 2.5.x

С появлением Modernizr 2.5.x вышесказанное больше не соответствует действительности. сокращенный список изменений указывает, что:

Мы больше не включаем Respond.js в компоновщик, поскольку он создавал конфликты при сбое в IE8. Если вам все еще требуется Respond.js в вашем проекте, просто включите его вручную.

Это означает, что Modernizr.mq('only all') может сейчас вернется false ...

2 голосов
/ 10 октября 2011

Только что заметил, что этот вывод сделан в комментариях к ответу Феликса - я оставляю здесь свой ответ на случай, если он поможет другим посетителям, которые, как и я, не получили его.

Не уверен, что это все еще проблема, но если вы загружаете Modernizr v2.0.6, вам не нужно запускать этот тест.Просто добавив его на свою страницу, вы должны автоматически запустить response.js, и ваши медиа-запросы должны начать работать.

Я тоже ломал голову над этим, так как в IE8 мне возвращалось "true"!!Плохо объяснено на сайте Modernizr, но упоминается в http://html5boilerplate.com/ (первая инстанция)

...