Javascript Countdown Timer

**Shadow Wizard** · July 27th, 2011, 01:54 AM

Originally Posted by Raship

Dear Shadow Wizard,

I am novice, newbie or beginner in HTML and code designing.
Thats why I used blogger's WYSIWYG to create my website.

I post an article every alternate day. Now, I want to generate one counter for my blog which restart after every (48 Hours) 2 days.

I little know about scripts so please advise which code to put in head and which in body. Or blogger allows me to put html code as widget. So simple javascript is also an option.

Hear is my blog address just in case: sharadthakars.blogspot.com

Thanks in advance.

Hey sorry for the late reply, hope it's still relevant.
First, download the ZIP and put the CountDown.js file in the same directory as your other files.
Then in the head section, add this line:

Code:

<script type="text/javascript" src="CountDown.js"></script>

Now in your body have such HTML to define container element for the timer:

Code:

<div id="CountDownPanel"></div>

And finally to "create" the timer add this code to either the head or body, it doesn't matter:

Code:

<script type="text/javascript">
window.onload = function(event) {
	ActivateCountDown("CountDownPanel", 100);
};
</script>

This will count 100 seconds for example.

**Raship** · July 27th, 2011, 04:46 AM

Dear Shadow Wizard,

Thanks for your reply. Its never late and yes its still relevant.
Regarding downloading the countdown.js file, the blogger(by google) do not let me put any file to index...

Everything I have to deal with is template design they offer.
So I guess we have to insert code.

I think I failed to explain well what actually I want.

I want count down which will start from 1d:23:59:59 like that and as soon as it comes to 0d:00:00:00 (complete) it start again so my end result will be like below

Next article in: 1d:23:59:59
So there is no specific date to target... its ongoing

I have set blogger to publish articles at 12:00am GMT +5:30

So, if we get our code to get time as per GMT +5:30, then it will be cherry on top..

I know <head> and <body> tag but I am new to html, script etc..., so your last thing about "create timer" I didn't understand.. sorry for my ignorance(may be there is nothing to understand, only copy paste required)

Again sorry for any trouble.. I will appreciate if you can give code/script in copy paste format

Thanks

**Raship** · August 12th, 2011, 03:01 AM

Dear Shadow Wizard,

Thanks for your reply.

First thing first, is it possible to copy all the text in the countdown.js and paste in head of my blog to get it working?
Because blogger.com doesn't give facility to add any files to root folder.

Originally Posted by Shadow Wizard

Hey sorry for the late reply, hope it's still relevant.
First, download the ZIP and put the CountDown.js file in the same directory as your other files.
Then in the head section, add this line:

Code:

<script type="text/javascript" src="CountDown.js"></script>

Secondly, my situation is, my blog is automatically posting article at every 48 hours(to be precise 12:00 am GMT+5.30 every alternate day). So If we calculate seconds of 48 hrs and put in code, it will start everytime visitor start page. Actually I want countdown time same for all visitors and should exectly start 12.00 am GMT +5.30 every alternate day.

Originally Posted by Shadow Wizard

Now in your body have such HTML to define container element for the timer:

Code:

<div id="CountDownPanel"></div>

And finally to "create" the timer add this code to either the head or body, it doesn't matter:

Code:

<script type="text/javascript">
window.onload = function(event) {
	ActivateCountDown("CountDownPanel", 100);
};
</script>

This will count 100 seconds for example.

Phew, thats lot of asking but nothing against your expertise.

Thanks

**Shadow Wizard** · August 16th, 2011, 06:36 AM

Sorry, I've looked into this now and it's too complicated, unless you can use server side code which looks like you can't.

The main issue is knowing the "target" date, i.e. when the timer should stop. If you had fixed date like "always count to 10/10/2012" it was still simple, but you need "count to 12 AM of tomorrow or the day after, GMT +5.5" which is really complicated due to the fact each browser can have different time zone.

If you have server with ASP at your disposal, assuming it's already at the proper timezone, you could send the time difference in seconds to the client and count using this number - if relevant let me know.

Sorry again, but you simply have "unique" need that is not supported by the script I wrote.

**Raship** · August 16th, 2011, 11:46 PM

Dear Shadow Wizard,

Many thanks for taking time and reply. You are right its 'complicated' need. But its all right. Following are few things came to my mind.

Option 1
I think blogger first asked me, which timezone I am in?
And its posting posts according to my time zone, so I guess if that can help anything with coding.

Option 2
Can we get time from outer source?
like from worldtimeserver current_time IN
then we manipulate?

Option 3
I have set to publish articles on specific date and time, so if we set counter on target date and add +2 on those dates, is it possible to get what we want?

We give this a last chance. With a light of hope.
Thanks

**Shadow Wizard** · August 17th, 2011, 02:48 AM

You need to use server side language like ASP - do you have such ability in your blog?

**Raship** · August 17th, 2011, 03:14 AM

Dear Shadow Wizard,

Thanks for your quick reply. Unfortunately there is no ASP support in blogger.

If we go with our scripting, is it possible to set addition counter +2 days for target date?

Originally Posted by Shadow Wizard

You need to use server side language like ASP - do you have such ability in your blog?

**Shadow Wizard** · August 17th, 2011, 03:23 AM

Originally Posted by Raship

Dear Shadow Wizard,

Thanks for your quick reply. Unfortunately there is no ASP support in blogger.

If we go with our scripting, is it possible to set addition counter +2 days for target date?

No, sorry.. currently it looks like solid wall.

I will keep this in mind though, and if any idea will come to mind I'll check it out.

**Raship** · August 17th, 2011, 03:51 AM

Thanks anyways.
I appreciate your efforts for me.

Originally Posted by Shadow Wizard

No, sorry.. currently it looks like solid wall.

I will keep this in mind though, and if any idea will come to mind I'll check it out.

**abnormal** · October 9th, 2011, 08:35 PM

Hi!
I'm working on penny auction website. i need a countdown timer for each product. And when the time left is under 20 seconds restart again to countdown from 20 seconds when the use click on bid button... the same as quibids website
Thanks in advance

**JackieBolinsky** · February 23rd, 2012, 12:40 AM

Thank you @Shadow.

I have developed a similar code for the same javascript countdown timer. Hope it is useful too.

is.gd/javascriptcountdowntimer

Jackie

**gotic** · May 17th, 2012, 09:41 AM

Hi Im newbie who trying to create my own website. i have question need your expertise

I want to create countdown time (day:hour:minute:second) which link to database. example same as groupon.com

Anybody can help me?

Threads:	525,399
Posts:	977,020
Members:	220,321

Developer Shed Network

ASP Free Login

Menu

Great community. Great ideas.

Thread: Javascript Countdown Timer

48 hours countdown

48 hrs loop code GMT+5.30

Time from outer web

No ASP support :(

I need penny auction countdown timer, please

link countdown timer from database time

Similar Threads

ASP countdown timer

Small Javascript Timer Problem

Acessing and Updating Timer database using Javascript?

help, make timer! ASP & Javascript

Javascript Timer

ASP Free on Facebook

ASP Free on Twitter Follow @ASPFree

ASP Free Advertisers and Affiliates

Popular Forum Categories

Forum Statistics

ASP Free Login

Great community. Great ideas.

Thread: Javascript Countdown Timer

48 hours countdown

48 hrs loop code GMT+5.30

Time from outer web

No ASP support :(

I need penny auction countdown timer, please

link countdown timer from database time

Similar Threads

ASP Free on Facebook

ASP Free on Twitter Follow @ASPFree

ASPFree Social