Multiple JavaScript / jQuery countdown timer in a page?

Ashish Kumar

Hi Developers,

I am creating a page where may products are coming with there expiration date. The expiration date is shown in a CountDown Timer format. I mean every product has it's own countdown timer with different values. I just want to do this with JavaScript or jQuery.

This timer script must have some objectives like:

Every timer must take it's deadline inline from the showing DIV
Another timer must not be effected from the others countdown timer
After expiration of any timer, this must show text "Expired!"

If somebody is having idea or code for this, please help me out. Thanks in advance....

7 Replies

Know the answer? Post it — somebody with the same question will find it here.

Ibrahim Rashid14y ago
HI, Ashish
Gone through the link(http://dealsandofferz.com) and have a watch of source code.

Found a solution that may help you.

1.Initialize countdown timer for each items on page load or when binding html tag for timer.
Reply me if it's not help you.

Thanks
Sam Hobbs14y ago
I think it is more a matter of you understanding better what I am saying instead of me understanding better what you are saying.

You do not have to use more than one timer. My suggestion will work. Except there is one thing I think you did not specify; your web page is updating the countdowns every second. Therefore you could just use one timer with an interval of 1 second. Then for each item, update the time remaining. If the time remaining is zero or less then it has expired. I suggest however that each time the timer ticks, re-calculate the amount of time (milliseconds) until the next second will elapse. Then if the system's performance affects the timer then it will automatically correct.

Another thing you did not specify is if the timers must have a resolution less than a second in the sense that one timer can elapse half a second before or after any other. I assume that fractions of seconds are not relevant.
Suthish Nair14y ago
I need to find?
Ashish Kumar14y ago
This is created by me only. This is having some issues on postback, so I need to use some other JS. Please find any other.
Thanks for your kind reply.
Suthish Nair14y ago
The website already have the javascript attached.

Download and test it..

http://dealsandofferz.com/js/countdown.js
Ashish Kumar14y ago
Sam, Thanks for your quick reply. As you asked that why I need to use more count down timers in my page, So, Here I am giving a link: http://dealsandofferz.com/

Please Visit this link and check out Products coming under featured deals. There you will see countdown timer with every product. I am sure, you would have things clear now.
Sam Hobbs14y ago
Someone else asked a very similar question a couple of days ago and I was unable to explain what I was trying to explain.

I see no reason why you must have many timers. You can do it all with one timer. You just need to set the timer to the amount of time in the future that the most recent time will occur in. Then when the most recent one occurs, set the timer again to the amount of time in the future that the next time will occur in.