Hi am working on this Count Up/Count down Timer however I can't get the minutes to return back to 00 after an hour has elapsed (or reach 60).
The 60 remains and it just continues counting the minutes (e.g. 1:61:09).
I would like it to show (e.g. 1:01:09)
$(document).ready(function() {
jQuery.fn.countUpDown = function(settings,to) {
settings = jQuery.extend({
startFontSize: '12px',
endFontSize: '12px',
duration: 1000,
direction: 'down',
startNumber: 10,
endNumber: 0,
callBack: function() { }
}, settings);
return this.each(function() {
//where do we start?
if(!to && to != settings.endNumber) { to = settings.startNumber; }
hours = Math.floor(to / 3600);
minutes = Math.floor(to / 60);
seconds = Math.round(to % 60);
if (seconds < 10) {
seconds = "0"+seconds;
}
if (minutes < 20) {
minutes = "0"+minutes;
}
//set the countdown to the starting number
$(this).text(hours+ ':' +minutes + ':' + seconds).css('fontSize',settings.startFontSize);
//loopage
$(this).animate({
'fontSize': settings.endFontSize
},settings.duration,'',function() {
if(settings.direction == 'down'){
if(to > settings.endNumber + 1) {
$(this).css('fontSize',settings.startFontSize).text(to - 1).countUpDown(settings,to - 1);
}
else{
settings.callBack(this);
}
}
if(settings.direction == 'up') {
if(to < settings.endNumber - 1) {
$(this).css('fontSize',settings.startFontSize).text(to + 1).countUpDown(settings,to + 1);
}
else{
settings.callBack(this);
}
}
});
});
}; //count up $('#countdown').countUpDown({ direction: 'up', startNumber: 3590, endNumber: 500*500, callBack: function(me) { $(me).text('All done! This is where you give the reward!').css('color','#090'); } }); //count Down /$('#countdown').countUpDown({ direction: 'down', startNumber: 3600, endNumber: 0, callBack: function(me) { $(me).text('All done! This is where you give the reward!').css('color','#090'); } });/
});
<div id="content">
<h1>jQuery CountUP & CountDown Plugin</h1>
<p><span id="countdown">All done! This is where you give the reward!</span></p>
</div>