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始终......你正在测试错误的东西！

根据docs：

如果浏览器根本不支持媒体查询（例如oldIE），则mq（）将始终返回false。

但是：Modernizr.mq()也是false！你必须实际测试一些东西。在这里，all关键字正是您所需要的（或保罗建议的only all）：

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

但是，所有带有mq的Modernizr 2.0.x 的自定义版本都包含respond.js，因此您永远不需要对此进行测试，除非您要加载另一个polyfill代替。在这种情况下，您需要从构建中禁用/删除respond.js。

Modernizr 2.5.x

随着Modernizr 2.5.x的到来，上述情况已不再适用。 abbreviated changelog指定：

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

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

Answer 2

刚刚注意到这个结论是在Felix回答的评论中得出的 - 我在这里留下我的答案，以防其他访问者像我一样没有得到它。< / em>的

不确定这是否仍然存在问题但是如果您要加载Modernizr v2.0.6，则不需要运行此测试。只需将其添加到您的页面即可自动启动respond.js，您的媒体查询应该开始工作。

我一直在摸不着头脑，因为我一直在IE8中得到“真实”！在Modernizr网站上解释不当，但在http://html5boilerplate.com/（第一个实例）中提到了

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

2 个答案:

Modernizr 2.5.x