Slim AJAX Loading Indicator Library – microbar

Category: Javascript , Loading , Recommended | August 10, 2018
Author: ManrajGrover
Views Total: 1,883
Official Page: Go to website
Last Update: August 10, 2018
License: MIT

Preview:

Slim AJAX Loading Indicator Library – microbar

Description:

microbar is a very small and easy to use JavaScript library for generating a top slim progress bar to indicate the ajax loading status as you seen on Youtube and Github.

Installation:

# NPM
$ npm install microbar --save

How to use it:

Include the micrbar.js library right before the closing body tag.

<script src="microbar.js"></script>

Override the default settings.

var settings = {

    // percentage
    percentage: 50,

    // background color
    color: 'red',

    // animation speed
    speed: 2,

    // target container
    target: 'myContainer'
    
};

Initialize the AJAX loading indicator.

var bar = new microbar( settings);

API methods.

// Move bar forward
bar.moveTo(80);

// Get color of progress bar
bar.getColor();

// Set color of progress bar
bar.setColor('#141414');

// Get speed of progress bar
bar.getSpeed();

// Set speed of progress bar
bar.setSpeed(5);

Changelog:

v0.1.7 (08/10/2018)

  • rewritten in ES6

Leave a Reply