需要在html5文件中引入的CreateJS库文件是preloadjs-0.4.1.min.js
HTML5文件如下:
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <title>4、CreateJS介绍-PreLoadJS</title> 6 <script src="preloadjs-0.4.1.min.js"></script> 7 <style> 8 .image{ 9 max-width: 320px; 10 max-height: 240px; 11 border: 1px solid #555; 12 margin: 5px; 13 } 14 </style> 15 </head> 16 <body> 17 <img class="image" id="winter" /> 18 <img class="image" id="spring" /> 19 <img class="image" id="summer" /> 20 21 <script src="app.js"></script> 22 </body> 23 </html>
在HTML5文件中引入的app.js文件源码如下:
1 /** 2 * create 4、CreateJS介绍-PreLoadJS-app.js by dpp on 2016/1/4 3 * @authors Your Name (you@example.org) 4 * @date 2016-01-04 01:32:58 5 * @version $Id$ 6 */ 7 8 var preload; 9 preload = new createjs.LoadQueue(false , 'images/'); 10 11 var plugin = { 12 getPreloadHandlers:function(){ 13 return{ 14 type:['image'], 15 callback:function(src){ 16 var id = src.toLowerCase().split('/').pop().split('.')[0]; 17 var img = document.getElementById(id); 18 return {tag:img}; 19 } 20 } 21 } 22 } 23 24 preload.installPlugin(plugin); 25 preload.loadManifest([ 26 'banner.gif', 27 'spring.jpg', 28 'summer.jpg', 29 'winter.jpg' 30 ]);
还需引入一个MP3文件夹用来存放图片
例子"4、CreateJS介绍-PreLoadJS"的源码地址:https://github.com/daipianpian/CreateJS-Study/tree/master/1%E3%80%81CreateJS%E4%BB%8B%E7%BB%8D/L04_PreLoadJS