Skip to content

Commit 0862ee5

Browse files
committed
Added examples
1 parent 2ea69a0 commit 0862ee5

File tree

1 file changed

+27
-0
lines changed

1 file changed

+27
-0
lines changed

README.md

+27
Original file line numberDiff line numberDiff line change
@@ -3,6 +3,16 @@ Counter-Up is a lightweight module that counts up to a targeted number when the
33

44
An improvement to https://github.com/bfintal/Counter-Up
55

6+
### What Can You Count Up?
7+
8+
* Floats: `1.234`
9+
* Integers: `1234`
10+
* With commas: `1,234.56`
11+
* With non-numeric characters: `$1,234.56`
12+
* Multiple countable values: `604,800 seconds in 10,080 minutes in 168 hours in 7 days`
13+
14+
### Usage
15+
616
**Install**
717
```bash
818
npm install --save counterup2
@@ -31,4 +41,21 @@ If you want to stop the counter immediately:
3141
```js
3242
// Stop counting. This brings back the original value.
3343
counterUp( el, { action: 'stop' } )
44+
```
45+
46+
### Use with Waypoints
47+
48+
The counting is performed when `counterUp` is called. To make the counting start when the element becomes visible, use a visibility library like [Waypoints](https://www.npmjs.com/package/waypoints)
49+
50+
For example:
51+
52+
```js
53+
// On DOM ready.
54+
require( 'waypoints/lib/noframework.waypoints.js' )
55+
const el = document.querySelector( '.counter' )
56+
new Waypoint( {
57+
element: el,
58+
handler: () => { counterUp( el ) },
59+
offset: 'bottom-in-view',
60+
} )
3461
```

0 commit comments

Comments
 (0)