BVB Source Codes

PreloadJS Show PluginSample.html Source code

Return Download PreloadJS: download PluginSample.html Source code - Download PreloadJS Source code - Type:.html
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.         <title>PreloadJS: Plugin Sample</title>
  5.  
  6.         <link href="../_assets/css/shared.css" rel="stylesheet" type="text/css"/>
  7.         <link href="../_assets/css/examples.css" rel="stylesheet" type="text/css"/>
  8.         <script src="../_assets/js/examples.js"></script>
  9.  
  10.         <style>
  11.                 .image {
  12.                         max-width: 320px;
  13.                         max-height: 240px;
  14.                         border: 1px solid #666;
  15.                         margin: 5px;
  16.                 }
  17.         </style>
  18. </head>
  19.  
  20. <body onload="init()">
  21.  
  22. <header class="PreloadJS">
  23.         <h1>Example: Plugin</h1>
  24.  
  25.         <p>In this example, a PreloadJS plugin is defined, which parses a load item
  26.                 into an HTML image ID that is
  27.                 already present in the HTML DOM. PreloadJS will then use the image to do
  28.                 the loading, and the image
  29.                 will be displayed in its defined position when it is loaded.</p>
  30. </header>
  31.  
  32. <img class="image" id="texas"/>
  33. <img class="image" id="bluebird"/>
  34. <img class="image" id="nepal"/>
  35.  
  36. <script type="text/javascript" src="../lib/preloadjs-NEXT.combined.js"></script>
  37. <!-- We also provide hosted minified versions of all CreateJS libraries.
  38.  http://code.createjs.com -->
  39.  
  40. <script id="editable">
  41.         var preload;
  42.  
  43.         function init() {
  44.                 // Create a new queue.
  45.                 preload = new createjs.LoadQueue(false, "../_assets/art/");
  46.  
  47.                 // Use this instead to favor xhr loading
  48.                 //preload = new createjs.LoadQueue(true, "assets/");
  49.  
  50.                 var plugin = {
  51.                         getPreloadHandlers: function () {
  52.                                 return {
  53.                                         types: ["image"],
  54.                                         callback: function (item) {
  55.                                                 var id = item.src.toLowerCase().split("/").pop().split(".")[0];
  56.                                                 item.tag = document.getElementById(id);
  57.                                         }
  58.                                 };
  59.                         }
  60.                 }
  61.  
  62.                 preload.installPlugin(plugin);
  63.                 preload.loadManifest(["Texas.jpg",
  64.                                                           "BlueBird.png",
  65.                                                           "Nepal.jpg",
  66.                                                           "Autumn.png" //NOTE: Will not display
  67.                                                          ]);
  68.         }
  69. </script>
  70.  
  71. </body>
  72. </html>
  73.  
downloadPluginSample.html Source code - Download PreloadJS Source code
Related Source Codes/Software:
gotraining - Go Training Class Material : ... 2017-04-29
eigen - The Art World in Your Pocket or Your Trendy Tech C... 2017-04-29
rack-cors - Rack Middleware for handling Cross-Origin Resource... 2017-04-29
react-redux-tutorial - react-redux-tutorial in Chinese, catalog &&... 2017-04-29
swifter - Tiny http server engine written in Swift programmi... 2017-04-29
boto3 - AWS SDK for Python http://a... 2017-04-30
Fluidbox - Replicating and improving the lightbox module seen... 2017-04-30
jo - JSON output from a shell 2017-04-30
qTip2 - qTip2 - Pretty powerful tooltips ... 2017-04-30
swing - A swipeable cards interface. The swipe-left/swipe-... 2017-04-30
growth - Growth - App to help you Be Awesome Developer &... 2017-05-06
TourGuide - TourGuide is an Android library that aims to provi... 2017-05-06
urh - Universal Radio Hacker: investigate wireless proto... 2017-05-06
Gutenberg - A meaningful web typography starter kit. 2017-05-06
NiftyDialogEffects - Nifty Modal Dialog Effect 2017-05-06
opengapps - The main repository of the Open GApps Project ... 2017-05-06
The micro CMS network asked administration system (the original PHP168 S series) v20161230 - 1, upgraded the mobile version. 2, upgrade the st... 2017-05-06
The news industry marketing website HTML 5 v5.7 site source code - Dedecms latest version of kernel development and o... 2017-05-06
Dream weaving white large entrepreneurial wealth information class site template v1.0 - Dream white large entrepreneurial wealth of inform... 2017-05-06

 Back to top