jquery-levelup
Simple +1/-1 Animation similar to point accumulation in a video game.
Plans
See issues.
Usage
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="/libs/jquery-levelup/jquery.levelup.min.js"></script> <span>counter <span style="font-weight: bold;" id='the_cnt'>0</span></span> <script> var $tc = $('#the_cnt'); $tc.levelup({'start' : 0}); $('#incrementBtn').on('click', function(event) { $tc.levelup('increment', 1); $(this).blur(); }); $('#decrementBtn').on('click', function(event) { $tc.levelup('decrement', 1); $(this).blur(); }); </script>Options
You should specify options like in usage example above.
| Name | Type | Default | Description |
|---|---|---|---|
| start | integer | 0 | Start value for span. |
| incrementer/decrementer.bold | boolean | true | Whether the incrementer |
| incrementer/decrementer.color | CSS color string | null | Change the incrementer |
| incrementer/decrementer.class | string | null | Add a class to the incrementer |
| showThousands | boolean | false | Whether to use a thousands separate everywhere |
| thousandSep | string | "," | The thousand separator to use |
| Methods | Params | | ---- | ---- | ---- | | increment | integer by which to increment | | decrement | absolute value of integer by which to decrement (always positive) | | reset | | | get | | Returns the current value after all pending animations are completed.
