在我的响应式网站的页脚,我尝试使用 yep-nope 和 underscrore.js 加载适用于移动设备和桌面设备的不同脚本
var $window = $(window)
,throttled = _.throttle( packageLoader, 500);
$window.resize( throttled );
当浏览器窗口大小改变时,会触发上述函数。它等待 500 毫秒,然后触发“packageLoader 函数。
<script src="/assets/javascripts/yepnope.1.5.4-min.js"></script>
<script src="/assets/javascripts/underscore-min.js"></script>
function packageLoader(){
Modernizr.load([
{
test: Modernizr.mq('(max-width:768px)'),
yep:
[
'/assets/javascripts/zepto.min.js',
'/assets/javascripts/common-portable.js'
],
nope:
[
'//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js',
// Accommodation guide plugins
'/assets/javascripts/jquery.nouislider.min.js',
'/assets/javascripts/jquery.cycle2.min.js',
// END Accommodation guide plugins
'/assets/javascripts/common-desktop.js'
],
both:
[
'/assets/javascripts/main.js'
]
}
]);
}
window.onload = packageLoader();
问题:
IE7+
我需要一个好的解决方案来管理在不同窗口大小下运行的脚本 - 我希望移动网站尽可能轻便。所以我相信我需要一种方法。
• 从缓存或文件(如果不存在)加载 jQuery。 • 如果用户使用移动设备查看,则加载 zepto • 处理脚本
上面的脚本可能不是最好的解决方案,如果您已经构建了一个需要此控件的网站,请在让我知道您使用了哪些库之前..
提前致谢
最佳答案
yepnope 已被弃用,事实上,默认情况下它不会出现在 Modernizer 的下一个版本中。
将这些脚本连接在一起并对它们进行丑化可能会有更好的运气。在强调脚本文件的大小之前,我会担心额外的 http 请求/缩小(图像、脚本和 css 文件)。
关于javascript - 使用 yepnope 进行响应式设计脚本处理,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19726436/