Faster, Higher, Stronger
更快,更高,更强

Use of PreloadJS


var $ = jQuery
// indicator for preloading percentage
var $indicator = $('#loadingInner')
var preload
var manifest = [
  {
    src: '/img/magic.jpg',
    id: 'magic'
  }, {
    src: '/img/snow.png',
    id: 'snow'
  }
]

// start preloading
function startPreload () {
  preload = new createjs.LoadQueue(true)
  preload.on('fileload', handleFileLoad)
  preload.on('progress', handleFileProgress)
  preload.on('complete', loadComplete)
  preload.on('error', loadError)
  preload.loadManifest(manifest)
}

// handle single file
function handleFileLoad (event) {
  console.log('File type: ' + event.item.type)
  /*
  if(event.item.id == 'magic'){
    console.log('majic picture has been loaded!');
  };
  if(event.item.id == 'photo') {
    console.log('photo picture has been loaded!')
  }
  */
}

// handle preloading error
function loadError (evt) {
  // console.log('There is something wrong!',evt.text);
}

// handle preloading process
function handleFileProgress (event) {
  var percentage = preload.progress * 100 | 0
  $indicator.css({
    width: percentage + '%'
  })
}

// handle preloading success
function loadComplete (event) {
  // console.log('All resources have been loaded!');
  setTimeout(function () {
    $('#page0').slideUp(600)
  }, 300)
  // console.log('Hello world!');
}
// invoke the method
startPreload()
赞(0) 打赏
未经允许不得转载:峰间的云 » Use of PreloadJS

评论 2

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址
  1. #1

    现在不从事专业的工作了?看你好像要跳进前端的坑了

    mary5年前 (2015-12-08)回复
    • 对啊,已经转行做前端了。

      Yakima Teng5年前 (2015-12-18)回复

觉得文章有用就打赏一下文章作者

支付宝扫一扫打赏

微信扫一扫打赏