Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/djyde/ToProgress
A lightweight top progress bar
https://github.com/djyde/ToProgress
Last synced: about 2 months ago
JSON representation
A lightweight top progress bar
- Host: GitHub
- URL: https://github.com/djyde/ToProgress
- Owner: djyde
- Created: 2015-06-13T14:32:17.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2017-11-14T10:12:46.000Z (almost 7 years ago)
- Last Synced: 2024-06-29T04:33:19.944Z (3 months ago)
- Language: JavaScript
- Homepage: http://djyde.github.io/ToProgress
- Size: 33.2 KB
- Stars: 522
- Watchers: 16
- Forks: 52
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# ToProgress
[![NPM version](https://img.shields.io/npm/v/toprogress.svg?style=flat-square)](https://www.npmjs.com/package/toprogress)
[![npm](https://img.shields.io/npm/dt/toprogress.svg)](https://www.npmjs.com/package/toprogress)
[![npm](https://img.shields.io/npm/l/toprogress.svg)](https://www.npmjs.com/package/toprogress)A lightweight (2.2 KB), no-dependency top progress bar library.
# Demo
http://djyde.github.io/ToProgress
# Screenshot
#### Desktop
![desktop](http://ww4.sinaimg.cn/large/62580dd9gw1et3i1t9amjj218b0q5juw.jpg)#### Mobile
![mobile](http://ww2.sinaimg.cn/large/62580dd9gw1et41eqm2usg20f00qo7if.gif)# Quick Start
```JS
var options = {
color: '#EEE',
duration: 0.2,
height: '2px'
}
var topbar = new ToProgress(options);
```# Support
* IE >= 10
* Chrome
* Firefox
* Safari# Use cases
If you are using ToProgress.js in production, just tell us.
# API
### new ToProgress(options[,selector])
* options
* **id** - the id of auto-created progress bar element
* **color** - progress bar color
* **height** - progress bar height
* **duration** - increase duration (seconds)
* **position** - the progress bar position. `top` or `bottom`* **selector** - valid css selector, if is defined, progress bar will be put on the top of the element. Only find the first element.
### .increase(progress[,callback])
* **progress** - percentage number### .decrease(progress[,callback])
* **progress** - percentage number### .setProgress(progress[,callback])
* **progress** - percentage number### .reset([,callback])
### .finish([,callback])
### .getProgress()
return current progress (percentage number)### .show()
### .hide()# License
MIT License