// Demo 1
var Counter1 = new MooCage.CounterCage('counter1');
Counter1.start(20);

// Demo 2
var Counter2 = new MooCage.CounterCage('counter2', {
    dir    : 'up',
    jumper : 100,
    limit  : 2000,
    interv : 5000
});
Counter2.start(0);

// Demo 3
var Counter3= new MooCage.CounterCage('counter3', {
    limit  : 86380,
    istime : '{d}D {h}:{i}:{s}'
});
Counter3.addEvent('timeup', function(){
    document.id('counter3').set('text', document.id('counter3').get('text')+' Time is up!');
});
Counter3.start(86405);

/* No CSS Involved */

<h2>Countdown with default options</h2>
<p id="counter1"></p>


<h2>Countup to 10000</h2>
<p id="counter2"></p>


<h2>Time countdown</h2>
<p id="counter3"></p>

Counter FX

The examples below show how the CounterCage class works, and how you can tweak it for some specific needs.

Countdown with default options

This countdown FX starts with 20, decreases 1 per every 1000 mseconds with NO limit. It countinues even when the number is negative.

Countup to 10000

This countup FX starts with 0, increases 100 per every 5000 mseconds, and will stop at 2000.

Time countdown

This is a timer counter. It displays result as time, formatted to 'd hh:ii:ss' with MooCage.FUNCage.FormatCounterTime(). The counter starts with 1D 00:00:05, stops at 0D 23:59:40, and fires 'timeup' event.