zoukankan      html  css  js  c++  java
  • 4、CreateJS介绍-PreLoadJS

    需要在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

  • 相关阅读:
    《阿里感悟》- 技术人员的职业规划
    DIV Vue-cil脚手架
    Django PIL模块(生成随机验证码)
    Django auth模块(用户认证组件)
    Django 数据处理流程
    Django 中间件
    Django ORM (2)
    Django组件——Form
    Django orm
    Django urls
  • 原文地址:https://www.cnblogs.com/daipianpian/p/5123991.html
Copyright © 2011-2022 走看看