@cycjimmy/h5-preloader

Resources pre-load for h5 page


Keywords
h5, preloader
License
MIT
Install
npm install @cycjimmy/h5-preloader@1.0.0

Documentation

H5 Preloader

libraries dependency status libraries sourcerank Coverage Status Release date rollup semantic-release jest npm license

Resources pre-load for h5 page. Demo

Install

NPM version NPM bundle size npm download

# via npm
$ npm install @cycjimmy/h5-preloader --save

# or via yarn
$ yarn add @cycjimmy/h5-preloader

Usage

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.

CDN

jsdelivr

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>