如何让 Modernizr 与 respond.js 一起使用?
我正在使用 CSS3 媒体查询创建逐步增强的设计,首先响应小屏幕尺寸,然后使用媒体查询响应更大的屏幕尺寸。
当然,媒体查询不适用于 IE8 及更低版本。我尝试的解决方案是使用现代化器和respond.js。
我脑子里有这样的想法:
<script type="text/javascript">
Modernizr.load({
test: Modernizr.mq,
nope: '/js/respond.min.js'
});
</script>
在 Firefox 中,我在控制台中看不到 JS 错误。网络栏表明现代化正在交付。
在 IEtester 中,我打开了 IE8 面板。该页面的行为就像不存在 respond.js 一样。在 IETester 的调试栏中,我转到“链接”。 Respond.min.js 未列出。
我做错了什么?
I'm creating a progressively enhanced design with CSS3 media queries, responsive to small screen sizes first, and then larger, using media queries.
Of course, media queries don't work on IE8 and below. My attempted solution is to use modernizer and respond.js.
I have this in my head:
<script type="text/javascript">
Modernizr.load({
test: Modernizr.mq,
nope: '/js/respond.min.js'
});
</script>
In firefox, I can see no JS errors in the console. The network bar indicates that modernizr is being delivered.
In IEtester, I have an IE8 panel open. The page is behaving as if respond.js is not present. In IETester's debug bar, I go to 'links'. Respond.min.js is not listed.
What am I doing wrong?
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(1)
来自 Modernizr 文档: http://www.modernizr.com/docs#mq --使用媒体查询测试似乎需要字符串参数。您可以使用如下测试:
您可能想查看 Alex Sexton(Modernizr.load 的创建者)的评论,该评论建议反对异步加载 Respond.js,因为它对网站。
https://github.com/scottjehl/Respond/issues/14#issuecomment-1017652
From the Modernizr docs: http://www.modernizr.com/docs#mq -- the string argument seems to be required to use the media query testing. You could use a test such as:
You might want to look at this comment from Alex Sexton (creator of Modernizr.load) that recommends against asynchronous loading of Respond.js due to its highly visual impact on a website.
https://github.com/scottjehl/Respond/issues/14#issuecomment-1017652