为什么我无法使用 modernizr 检测 IE9 中的媒体查询答案

【问题标题】：Why I can't detect Media Queries in IE9 using modernizr为什么我无法使用 modernizr 检测 IE9 中的媒体查询
【发布时间】：2013-04-19 02:27:17
【问题描述】：

我在浏览器中搜索了对CSS3媒体查询的支持，IE9+支持，http://caniuse.com/css-mediaqueries，但是当我用Modernizr检测的时候发现，ie7-ie9不支持，ie10支持它。我要做的是：

生成自定义modernizr js：http://modernizr.com/download/#-mq-teststyles-load

html代码：下面是我的html头代码，我想检测浏览器是否支持最小宽度媒体查询使用，如果支持，添加support.js，如果不支持，包括nosupport.js

<script src="modernizr.custom.03829.js" type="text/javascript"></script>
<script>
    Modernizr.load({
        test: Modernizr.mq('(min-width: 0px)'),
        yep: 'support.js',
        nope: 'nosupport.js'
    });
</script>

在 support.js 中：alert("support");
在 nonosupport.js 中：alert("not support");

结果：ie7-ie9 提示“不支持”，在 ie10 中提示“支持”。我认为ie9也应该提醒“支持”，对吧？我的代码有问题吗？

另一个奇怪的事情是如果我使用来自http://modernizr.com/docs/#mq 的示例用法：

Modernizr.mq('only screen and (max-width: 768px)')  // true

Chrom、firefox 和 IE7-10 会提示“不支持”，我认为现代浏览器应该提示“支持”。为什么？

【问题讨论】：

标签： javascript cross-browser media-queries modernizr

【解决方案1】：

关于您的第一个问题 - 我无法复制。 Modernizr.mq('(min-width: 0px)') 在 IE 9 中为我返回 true。在 F12 工具中检查您的文档模式，看看您是否正在退回到非标准模式。

第二次，浏览器的现代性与它是否会返回 true 无关。 Modernizr.mq 测试浏览器是否匹配媒体查询。如果为 false，则表示浏览器窗口大于 768 像素。

【讨论】：