现代化的ie8媒体查询支持

时间:2011-10-15 10:01:01

标签: html css html5 css3 media-queries

我正在使用modernizr来支持ie8中的媒体查询。 能否请您提供一个实施相同的例子。

我也看了一下Respond.js,但发现它与所有CDN的东西有点复杂。

任何其他建议也将受到赞赏。

3 个答案:

答案 0 :(得分:11)

如果要在IE8中使用媒体查询,则必须使用Respond.js。这是支持浏览器媒体查询的polyfill。

Modernizr仅提供媒体查询测试。根据该文档,在较旧的非支持浏览器中,测试将始终返回false。

另一个替代方案是由Nathan Smith创建的960gs网格系统的adapt.js

更新: Modernizr现在正在doc

中所述的旧版IE中添加对html5标签的支持

答案 1 :(得分:3)

Modernizr不会向浏览器添加功能;它只是检测浏览器是否支持某些功能,因此允许您的站点确定是否需要使用polyfill hack来实现该功能。

因此,您可以使用Modernizr来确定是否需要使用Respond.js。

Modernizr网站确实包含a page which lists all the polyfill hacks that they know of,因此如果您对Respond.js不满意,可以尝试在此处查看可用的替代方案。查看该页面,我看到“媒体查询”部分列出了其他一些内容,因此您可以尝试使用它们。

但是,我会说Respond.js似乎确实是目前推荐用于此类事情的一个脚本。我没有尝试过列出的其他内容,所以我无法对它们进行比较,但我可以说Respond.js的工作原理是有充分理由的。

Respond.js存在这些复杂的跨域问题的原因是,它与不了解媒体查询的浏览器一起工作的唯一方法是再次加载整个样式表并使用Javascript处理它。但是浏览器的安全模型不喜欢你用远程加载的脚本做那种事情。

正如我所说,我没有使用任何替代脚本,但我猜他们会遇到类似的问题,因为他们需要工作才能让媒体查询工作一个不支持它们的浏览器。

处理此问题的最简单方法是将respond.js脚本放在与您网站其余部分相同的域中,而不是从单独的域加载它。这完全绕过了处理CDN问题的任何需要。

希望有所帮助。

答案 2 :(得分:-7)

Internet Explorer 8不支持媒体查询。对于modernizr,这也不起作用。 Modernizr不会向浏览器添加功能。为什么要在ie8中添加媒体查询?媒体查询适用于移动网站。媒体查询不适用于桌面浏览器。