如何使用Modernizr检测媒体查询是否存在

Question

我正在尝试使用Modernizr 2检测媒体查询是否存在,然后在适当时加载respond.js.

我把它放在我的script.js文件中......

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

我究竟做错了什么？我很惊讶没有关于如何在Modernizr网站上使用媒体查询执行此操作的示例.这是我正在使用的Modernizr的版本......

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

Answer 1

那是因为!!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包括respond.js,所以你从来没有真正需要测试这一点,如果你想在另一填充工具,而不是除了.在这种情况下,您需要从构建中禁用/删除respond.js.

Modernizr 2.5.x

随着Modernizr 2.5.x的到来,上述情况已不再适用.该缩写的changelog规定:

我们不再在构建器中包含Respond.js,因为它在IE8中创建了崩溃冲突.如果您仍需要项目中的Respond.js,请手动包含它.

这意味着现在Modernizr.mq('only all') 可以返回false......