Countdown timer

HTML

<p>
<span id="countdown" style="font-size: 36px;">4</span>
</p>

CSS

[data-purpose="timer"] {
    
}
.timer {
    font-weight: bold;
    font-size: 2em
}

JavaScript

var CountDown = new Class({    //implements   Implements: [Options,Events],    //options   options: {     element: 'countdown',     start: 10,     finish: 0,     startFont: '36px',     finishFont: '12px',     onComplete: $empty,     duration: 1000   },      //initialization   initialize: function(options) {     //set options     this.setOptions(options);   },      //get things started   start: function() {     this.anim();   },      //animate!   anim: function() {     this.options.element.set('text',this.options.start--);     var fx = new Fx.Tween(this.options.element,{       duration: this.options.duration,       link: 'ignore',       onComplete: function() {         if(this.options.start >= this.options.finish) {           this.anim();         } else {           this.fireEvent('complete');         }       }.bind(this)     }).start('font-size',this.options.startFont,this.options.finishFont);   } });  /* usage */ window.addEvent('domready',function() {   var cd = new CountDown({     element: $('countdown'),     start: 12,     finish: 0,     onComplete: function() {       this.options.element.set('text','Done! Your special code is: <!--?php echo rand(1000,5000); ?-->').setStyle('color','#090');     }   }).start(); });