jQuery 仅在加载移动 CSS 时运行？

Question

我正在使用诸如

之类的媒体查询加载我的移动专用 CSS

<link rel="stylesheet" type="text/css" media="only screen and (max-device-width: 480px)" href="/includes/css/mobile.css" />

但除了这些 CSS 更改之外，我还需要重新排序部分 HTML，例如

$('#moveOne').after($('#theOther');

我只希望在浏览器确实加载了 mobile.css 时执行此操作。所以我想在 mobile.css 中添加一些奇怪的 CSS 值，然后像这样检查它的值

if($'#notVisible').css('color') == 'red') {
    $('#moveOne').after($('#theOther');
}

有更好的方法吗？

Answer 1

我觉得，你做的绝对好。

但更合乎逻辑的方法是设置 width 而不是 color。

if($'#notVisible').width() == '500px') {
    $('#moveOne').after($('#theOther');
}

另外，你可以试试matchMedia.js

看这里Using_media_queries_from_code也是。