Yepnope＆Modernizr screen.width条件

我正在尝试（本地）使用Yiznope和Modernizr来加载CSS和JS文件。 所以我可以更好地管理文件，并轻松编写代码。

这是目前的布局：

Modernizr.load([ { test: Modernizr.mq('all and (max-width: 1070px)'), yep: '/css/smartdevice.css','/js/smartdevice.js', } , { test: Modernizr.mq('all and (min-width: 481px) and (max-width: 1069px)'), yep: '/css/tablet.css','/js/tablet.js', }, { test: Modernizr.mq('all and (max-width: 1070px)'), yep: '/css/screen.css','/js/screen.js', } ]); 

我是JS的新手，但我在可能的场合使用过jQuery。 但是它们都会立刻加载，无论如何我可以根据px宽度加载CSS文件吗？ （参考上述值）。 我知道你可以做这个服务器端，但在我的位置。

它必须是js中的本地端…我目前在SCSS中编码。 一切都很好，这只是在窗口宽度上注入文件/显示文件的情况。

我认为我需要添加一个if语句，但是会提供很多帮助！

-Neil

PS我在本地运行，使用CodeKit和SCSS在新的iMac上运行。

Answer 1

yep: '/css/smartdevice.css','/js/smartdevice.js',是非法的JS。 如果你想让它成为一个数组，请使用yep: ['/css/smartdevice.css','/js/smartdevice.js'], . 任何时候你在JavaScript对象中看到一个逗号，假装有一个换行符，你会看到这里出了什么问题：

 Modernizr.load([ { test: Modernizr.mq('all and (max-width: 1070px)'), // prop:val(=function) yep: '/css/smartdevice.css', // prop:val(=string) '/js/smartdevice.js', // ??? } ,... 

Answer 2

一些建议：

1. 将“all”替换为“only all”标签
2. 用移动设备宽度（320等）替换第一次测试中的“max-width：1070px”