preload.js最近刚好用上，稳得一（预加载图片、音频、视频）

   之前做项目里面的资源太多，老是有图片没加载出来被人投诉，之前也写过图片预加载感觉还是很不稳，况且只能加载图片，我最近的项目有视频、音频和图片，然后我导师推荐我用preload.js，直接来代码呐，老弟

  <script src="./lib/preloadjs.min.js"></script>

先把库搞下来，http://www.createjs.cc/preloadjs/，然后上js

var mainfest = [
  { src: "img/loading.gif" },
  { src: "img/background.png" },
  { src: "img/bg_repeat.jpg" },
// 音频
  { src: "./music/loop.mp3",id:'loop' },
// 视频
 { src: "./video/video_01.mp4",id:'myVideo' }
  
];

var preload = {
  // 预加载函数
  startPreload: function () {
    var preload = new createjs.LoadQueue(true);
    //为preloaded添加整个队列变化时展示的进度事件
    preload.addEventListener("progress", this.handleFileProgress);
    //注意加载音频文件需要调用如下代码行
    preload.installPlugin(createjs.SOUND);
    //为preloaded添加当队列完成全部加载后触发事件
    preload.addEventListener("complete", this.loadComplete);
    //设置最大并发连接数  最大值为10
    preload.setMaxConnections(1);
    preload.loadManifest(mainfest);
  },
  // 当整个队列变化时展示的进度事件的处理函数
  handleFileProgress: function (event) {
    $(".percent").text('loading...' + Math.ceil(event.loaded * 100) + "%");
  },
  // 处理preload添加当队列完成全部加载后触发事件
  loadComplete: function () {
    shuangjie.$pageLoad.addClass('hide').next().removeClass('hide')
  }
}
preload.startPreload();

为啥我在资源那里加上id呢，是方便我调用的，比如我要使用音频的时候，createjs.Sound.play(‘loop’),播放那段音频，不过这又得引入soundjs这个库了，这里就不多说了，html的话

<div class="loading-wrap  center">
        <img class="load-gif" src="./img/loading.gif" alt="" />
        <span class="percent">0 %</span>
</div>

这个很好用，大家可以多点琢磨官网的api