Resources pre-load for h5 page. Demo
# via npm
$ npm install @cycjimmy/h5-preloader --save
# or via yarn
$ yarn add @cycjimmy/h5-preloader
import h5Preloader from '@cycjimmy/h5-preloader';
h5Preloader({
type: 'progressBar',
progressBar: {
eProgressBar: ...,
eProgressBarPercent: ...
},
resources: [
...
],
hookWhenProgressComplete: () =>
...
},
}).load();
-
h5Preloader
config:- resources: [Require][Array] Resource paths array.
- type: [Option][String] Set type of progress. Currently only supports
'progressBar'
. Default'progressBar'
. - progressBar: [Option][Object] Progress bar config
- eProgressBar: [Element] Element of Progress bar.
- eProgressBarPercent: [Element] Element for showing percent.
- hookWhenProgressComplete: [Option][Function] The hook function when the progress complete.
- autoComplete: [Option][Boolean] Whether to automatic operation the hook function when the progress complete. Default
true
-
h5Preloader
instance supports the following methods:-
load()
: Start preloader. -
progressComplete()
: Call the progress complete function manually.
-
To use via a CDN include this in your HTML:
<script src="https://cdn.jsdelivr.net/npm/@cycjimmy/h5-preloader@5/dist/h5-preloader.umd.min.js"></script>