jQuery Countdown Plugin

That’s funny, I did basically the same yesterday, only using PHP and CSS though. You can see my randomly styled PHP countdown here. Great blog you have.

Nice! I like this kind of stuff! Love your snippets

Really nice plugin…

But to be hones, I though it’s about a plugin counting down the time until a specific event… I am looking for a jquery-thing counting back the time until a specific date… Nevertheless => cool!

@Dirk – looks reallyreally great!

Really Nice one. Thanks for sharing.

Cool snippet! Made this myself last week but this one is much better! Thanks man!

very cool script. I’d like apply it on my website

excelente!

nice effect with the font-size :)

these snippets are all cool but they never seem to work for me. Its so frustrating. I have the countDown.js file linked with the sample code, altered to have my div class in there…and nothing. dammit.

I copied the source and it worked. Thanks :)
Maybe its something with the linked file that I’m doing wrong or the placement of the sample usage vs. the link…. I don’t know. anyway thanks again

ezFlash

Hi all,

Nice script I only have one question; I would like to use this script to countdown from let’s say 5 minutes and then repeat that. Hoe can I archieve this?

Thanks for this demo. I love the idea but I wanted to know if you could show how to alter this code so that it becomes a date countdown? I am looking for countdown to tax day.

Thanks for the plugin.
Here is a small modification for those who want to show time instead of minutes

//where do we start?
if(!to && to != settings.endNumber) { to = settings.startNumber; }

hours = Math.floor(to / 60);
minutes = Math.round(to % 60);
if (minutes < 10) {
minutes = "0"+minutes;
}

And change the text of course:

//set the countdown to the starting number
$(this).text(hours + ‘:’ + minutes).css(‘fontSize’,settings.startFontSize);

Try this, if you maybe need to have a choice on the direction it is counting:

jQuery.fn.countDown = 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; }

//set the countdown to the starting number
$(this).text(to).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).countDown(settings,to – 1);
}
else{
settings.callBack(this);
}
}

if(settings.direction == ‘up’) {
if(to < settings.endNumber + 1) {
$(this).css('fontSize',settings.startFontSize).text(to + 1).countDown(settings,to + 1);
}
else{
settings.callBack(this);
}
}

});

});
};

how do i do a time extension with this ? as in when users entered a bid or something the time extends directly in the page without refreshing in the explorer?

i know there is something to do with httprequest ajax but i could not find any help in google or yahoo neither forums anyone can help ?

i want the time to adjust immediately when the user submits the bid, then just add 15 seconds to the timer after you successfully send the bid via ajax. can anybody help me ?

ok what i have for the code which is the jquery countdown timer.

I wana make it Extends for the timer for example timer is 30 secs when i click on bid it will extend for another 10 secs into the database and it will update the existing countdown timer to 45 secs automatically

does anyone knows how to do that ?

can we reset the countdown (without reloading)? I can’t figure out a way to stop the original countdown when starting a new one in the same div.

Hi David,

I want to show the countdown in following two different formats as below:-

* min:seconds (Example- 8:29)
* hour:min:seconds (Example – 1:06:44)

Please suggest the solution in javascript.

Thanks