Modernizr 用于 ie8 媒体查询支持
我正在考虑使用 Modernizr 来支持 ie8 中的媒体查询。 您能否提供一个示例来实现相同的功能。
我还查看了 Respond.js,但发现它包含所有 CDN 内容,有点复杂。
任何其他建议也将不胜感激。
I am looking at using modernizr for supporting media query in ie8.
Could you please provide an example to implement the same.
I also had a look at Respond.js, but found it a bit complex with all the CDN stuff.
Any other suggestions would also be appreciated.
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(3)
如果您想在 IE8 中使用媒体查询,则 Respond.js 是必需的。这是为浏览器启用媒体查询的polyfill。
Modernizr 仅提供媒体查询测试。根据文档,在较旧的不支持的浏览器中,测试将始终返回 false。
另一种替代方案是由 960gs 网格系统的 Nathan Smith 创建的 adapt.js。
更新:
Modernizr 现在正在旧版 IE 中添加对 html5 标签的支持,如 doc 中所述
Respond.js is mandatory if you want to use mediaqueries in IE8. This is the polyfill that enables media queries for the browser.
Modernizr only offer test for mediaqueries. According to the doc, in older non-supporting browser the test will always return false.
Another alternative is adapt.js by Nathan Smith creator of the 960gs grid system.
Update:
Modernizr is now adding support for html5 tags in older version of IE as stated in the doc
Modernizr 不会向浏览器添加功能;它只是检测浏览器是否支持某些功能,因此允许您的网站确定是否需要为该功能使用polyfill hack。
因此,您可以使用 Modernizr 来确定是否需要使用 Respond.js。
Modernizr 网站确实包含 一个页面,其中列出了他们知道的所有 polyfill 黑客,因此,如果您对 Respond.js 不满意,您可以尝试在此处查看可用的替代方案。查看该页面,我发现“媒体查询”部分中列出了其他一些内容,因此您可以尝试一下。
不过,我要说的是,Respond.js 似乎是目前推荐用于此类事情的一个脚本。我还没有尝试过列出的其他方法,因此无法对它们进行比较,但我可以说 Respond.js 的工作方式是有充分理由的。
Respond.js 存在这些复杂的跨域问题的原因是,它与不理解媒体查询的浏览器一起工作的唯一方法是再次加载整个样式表并使用 Javascript 对其进行处理。但浏览器的安全模型不喜欢你用远程加载的脚本做这种事情。
正如我所说,我没有使用过任何替代脚本,但我的猜测是它们会遇到类似的问题,因为它们需要工作方式才能使媒体查询在浏览器上工作不支持他们。
处理此问题的最简单方法是将 respond.js 脚本放入与站点其余部分相同的域中,而不是从单独的域加载它。这完全绕过了处理 CDN 问题的任何需要。
希望有帮助。
Modernizr does not add functionality to the browser; it merely detects whether the browser supports certain functionality, and therefore allows your site to determine whether it needs to use a polyfill hack for that feature.
Therefore you would use Modernizr to find out whether you need to use Respond.js or not.
The Modernizr web site does include a page which lists all the polyfill hacks that they know of, so if you're not happy with Respond.js, you could try looking here to see what alternatives are available. Looking at the page, I see there are a few others listed in the "Media Queries" section, so you could try them.
However, I will say that Respond.js does seem to be the one script which is currently recommended for this kind of thing. I haven't tried the others listed, so I can't compare them, but I can say that Respond.js works the way it does for a good reason.
The reason that Respond.js has these complex cross-domain issues is that the only way for it to work with browsers that don't understand media queries is to load the whole stylesheet again and process it using Javascript. But the browser's security model doesn't like you doing that sort of thing with remotely loaded scripts.
As I say, I haven't worked with any of the alternative scripts, but my guess is that they'd suffer from similar issues, due to the way they'd need to work in order to get media queries working on a browser that doesn't support them.
The easiest way to deal with this is simply to put the respond.js script into the same domain as the rest of your site rather than loading it from a separate domain. This completely bypasses any need to deal with the CDN issue at all.
Hope that helps.
Internet Explorer 8 不支持媒体查询。对于 Modernizr,这也不起作用。 Modernizr 不会向浏览器添加功能。为什么要在 ie8 中添加媒体查询?媒体查询是为移动网站设计的。媒体查询不适用于桌面浏览器。
Media queries are not supported in internet explorer 8. Also with modernizr, this is not going to work. Modernizr does not add functionality to the browser. And why you want add media queries in ie8? Media queries are make for mobile websites. Media queries are not make for desktop browsers.