前言

最近為所服務機構寫了一個H5，名字和展現內容並不重要，就不贅述，鏗鏘鏗鏘一大頓，寫完了。效果不錯，符合主流手機瀏覽器，資源為3.49mb，不多不少，網速也都夠。領導拍拍腦袋，改改這裡，修修那裡，匆匆忙忙，就上線了，完美與殘缺總在一念之間。

一、微信H5沒有頁面載入效果是一種什麼樣的體驗

沒有載入頁，實話說，給我母親大人看的時候，她被突然奏響的BGM著實嚇了一跳，也有很多人看了一段時間的白屏頁，更有節點載入凌亂的個例。
沒放載入頁面，這是個大問題，是問題就要解決，而解決則要迅速。

遍尋百度，找到一份可快速編輯的載入頁外掛，“resLoader”。

二、先上乾貨，哪裡下載，怎麼用

var loader = new resLoader({
     resources : [
          'http://p2.qhimg.com/t01ed1438874f940dc0.jpg',
          'http://p9.qhimg.com/t01b4ff03b72c7dc6c7.jpg',
          'http://p2.qhimg.com/t01dd90dfbec92074d0.jpg',
          'http://p7.qhimg.com/t01cfec6d87cde457c5.jpg',
          'http://p9.qhimg.com/t01943ced462da67833.jpg'
 
,
          'http://p0.qhimg.com/t01943ced462da67833.jpg',
          'http://p6.qhimg.com/t01aa15a7ba7ccb49a7.jpg',
          'http://p8.qhimg.com/t010f1e8badf1134376.jpg',
          'http://p8.qhimg.com/t01cf37ea915533a032.jpg',
          'http://p3.qhimg.com/t0193d8a3963e1803e9.jpg',
          'http://p3.qhimg.com/t01cd6a4d4b4bd4457b.jpg'
 

     ],
     onStart : function(total){
          console.log('start:'+total);
     },
     onProgress : function(current, total){
          console.log(current+'/'+total);
          var percent = current/total*100;
          $('.progressbar').css('width', percent+'%');
          $('.progresstext .current').text(current);
          $('.progresstext .total').text(total);
     },
     onComplete : function(total){
          alert('載入完畢:'+total+'個資源');
     }
});

loader.start();

———待完善————