A simple Javascript library for preload image and audio. The main feature:
- set concurrency
- set minimum loading time per resouce, for simulate slow load
npm install --save preloader.js
Import
var Preloader = require('preloader.js')
Execute
var preloader = new Preloader({
resources: ['assert/images/logo.png', 'assert/audios/bg.mp3'],
concurrency: 4
})
preloader.addProgressListener(function (loaded, length) {
console.log('loading ', loaded, length, loaded / length)
})
preloader.addCompletionListener(function () {
console.log('load completed')
})
preloader.start()PS: If no use module bundler (e.g.: webpack、browserify), you can direct reference
<script src="src/preloader.js"></script>
-
resources
ArrayDefault:
[].Preload resouce list. The files of postfix belong to
['mp3', 'ogg', 'wav']to according audio handle.PS:Resources in addition to here configuration, including configured
attrvalue DOM node. -
concurrency
NumberDefault:
0.Concurrent number. 0 is no concurrency limit.
-
perMinTime
NumberDefault:
0. Unit:msMinimum loading time per resouce. Usually used to simulate load slow.
-
attr
StringDefault:
data-preload.DOM node attribute. Example:
<img src="img/logo.png" data-preload/>, the'img/logo.png'will been added inresources. -
crossOrigin
BooleanDefault:
false.If set to
true, which will set the crossOrigin property on images toAnonymousfor support images loaded from a CORS-enabled server. -
onProgress
FunctionDefault:
null.Every resouce load is completed the callback function. The effect same to
addProgressListener. -
onCompletion
FunctionDefault:
null.All resouces load is completed the callback function. The effect same to
addCompletionListener.
addProgressListener(Function)
Set every resouce load is completed the callback function
addCompletionListener(Function)
Set all resouces load is completed the callback function
get(String)
Get instances of completed
start()
Begin load. All ready after invoke.
MIT