JS Loading Overlay

Display loading overlay easily and beautifully in your application. JS loading overlay using awesome spinner from Load Awesome. It contains 52 spinner you can choose.

Features

• Full page loading overlay. Able to show full page loading overlay.

• Loading overlay inside container. Able to display the loading overlay inside the container

• Lock scroll. Able to lock the scroll during loading overlay active.

Documentation

For detail of installation instructions, in-depth usage, please take a look at the documentation.

How To Install

NPM
npm install --save js-loading-overlay

Yarn
yarn add js-loading-overlay

Use without NPM or Yarn
import 'js-loading-overlay'
JsLoadingOverlay.show({'spinnerIcon': 'triangle-skew-spin'});

How To Use

import 'js-loading-overlay'
JsLoadingOverlay.show({'spinnerIcon': 'triangle-skew-spin'});

or

<script src="js-loading-overlay.min.js"></script>
JsLoadingOverlay.show({'spinnerIcon': 'triangle-skew-spin'});

Show loading overlay with default options

JsLoadingOverlay.show();

Show loading overlay with custom options

JsLoadingOverlay.show({
  'overlayBackgroundColor': '#666666',
  'overlayOpacity': 0.6,
  'spinnerIcon': 'ball-atom',
  'spinnerColor': '#000',
  'spinnerSize': '2x',
  'overlayIDName': 'overlay',
  'spinnerIDName': 'spinner',
  'spinnerZIndex':99999,
  'overlayZIndex':99998
});

Hide Loading Overlay

JsLoadingOverlay.hide();

Changelog

Please see CHANGELOG for more information on what has changed recently.

Contributing

Please see CONTRIBUTING for details.

License

The MIT License (MIT). Please see License File for more information.