3

在我的响应式网站的页脚,我尝试使用 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 • 处理脚本

上面的脚本可能不是最好的解决方案,如果您已经构建了一个需要此控件的站点,请在告诉我您使用了哪些库之前...

提前非常感谢

4

1 回答 1

0

yepnope 已被贬值,事实上它默认不会出现在 Modernizer 的下一个版本中。

将这些脚本连接在一起并将它们丑化可能会更好。在我强调脚本文件的大小之前,我会担心额外的 http 请求/缩小(图像、脚本和 css 文件)。

于 2014-08-20T08:39:36.467 回答