| Author: | the-muda-organization |
|---|---|
| Views Total: | 1,657 views |
| Official Page: | Go to website |
| Last Update: | October 18, 2020 |
| License: | MIT |
Preview:
Description:
nanobar is a super tiny JavaScript library to create a custom *FAKE* page load progress bar on the top of the page.
How to use it:
1. Download and add the JavaScript nanobar.js to the page.
<script src="nanobar.js"></script>
2. That’s it. To customize the styles of the progress bar, just define the background color in the data-nanobar and then add the attribute to the body tag.
<body data-nanobar="#222"> <body data-nanobar="radial-gradient(circle at 30% 107%,#fdf497 0%,#fdf497 5%,#fd5949 45%,#d6249f 60%,#285AEB 90%)">
Changelog:
10/18/2020
- v1.0.0
See Also:
Simple Scroll Progress Indicator For Long Pages – PageBar.js
Generate Linear & Radial Progressbars Using CSS – Progress.css
Lightweight Scroll Progress Bar In JavaScript – scrollProgress.js
Modern Slim Progress Bar For Form Completion – Fort.js
Page Scroll Reading Progress Indicator with Progress.js
Simple Plain Circle Progress Bar Library – ProgressCircle.js
Easy Progress Bar Engine With Promise Support – Rsup Progress
Animated Circular Speedometer In Vanilla JavaScript