Lightweight Slim Javascript Progress Bar – nanobar

Category: Javascript , Loading , Recommended | June 13, 2018
Author: jacoborus
Views Total: 2,839
Official Page: Go to website
Last Update: June 13, 2018
License: MIT

Preview:

Lightweight Slim Javascript Progress Bar – nanobar

Description:

A super lightweight progress bar built on top of javascript and CSS3 transitions to create a slim indicator for content loading status.

How to use it:

Load the nanobar.js at the end of the document.

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

The sample javascript to manipulate the progress bar.

<script src="../nanobar.js"></var options = {
    bg: '#acf',
    // left target blank for global nanobar
    target: document.getElementById('myDivId'),
    // id for new nanobar
    id: 'mynano'
};

var nanobar = new Nanobar( options );

//move bar
nanobar.go( 30 ); // size bar 30%

// Finish progress bar
nanobar.go(100);script>

Changelog:

06/13/2018

  • Bugfix

One thought on “Lightweight Slim Javascript Progress Bar – nanobar

Leave a Reply