如何让 Modernizr 与 respond.js 一起使用?

发布于 2024-11-18 23:57:44 字数 495 浏览 4 评论 0原文

我正在使用 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 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(1

野却迷人 2024-11-25 23:57:44

来自 Modernizr 文档: http://www.modernizr.com/docs#mq --使用媒体查询测试似乎需要字符串参数。您可以使用如下测试:

Modernizr.mq('only screen')

您可能想查看 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:

Modernizr.mq('only screen')

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

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文