Flash/Actionscript countdown movieclip

Posted on June 19, 2005

Updated 2006-11-17

Here's a flash / actionscript countdown movieclip that I've used in a number of projects. The following example is counting down to my birthday, based on the client computer's time.

Further examples. Here are the key features:

  • The target date can be set via variables passed in the URL of the flash movie in the embedding HTML - i.e. no need to edit the flash file to change the target date.
  • If no target year is specified, the counter will automatically start counting down to the specified date in the next year, once the target date has been reached. (e.g. counting down to Christmas). If a year is specified, the counter stops at 000:00:00:00.
  • If PHP is available, the counter can calculate the current time from a small PHP script, gettime.php, which must be in the same directory as the HTML containing the countdown. The name of the script must be passed via an HTML variable: sc=gettime.php. The script can be replaced by another if PHP is not available / desirable - flash expects an XML file with a particular structure (again, see instructions in the first frame of the flash file).
  • If no script is specified in the function call, the counter will use the system time of the client. This is preferable when a localised time is prefered, rather than server time - e.g. counting down to Christmas.
  • The script is a self-contained movieclip with one 'public' function, and can easily be embedded in other flash projects.
  • Requires: actionscript 2 / flash player 6

Download latest version (ZIP)

Version history

2006-11-17. Version 3.3 released:

  • Flash 8 version, also exportable as Flash 7, 8. (Previous versions didn't work as 7 or 8)

2006-07-24. Version 3.2 released:

  • Ticking sound is turned off by default. Can be turned on using HTML variable snd=on.

2006-05-15. Version 3.1 released:

  • Path to script must be set via HTML variable sc. If variable is omitted, counter defaults to client time.

2006-05-05. Version 3 released:

  • Digit colour can be set via HTML variable.

2006-03-31 Version 2 released:

  • Added option to get current time from the server via PHP (set as default).
  • Added the year parameter to specify a date in a particular year, and stop the counter when that date is reached.

2005-06-19 Version 1 released.



Comments (86)

Thomas said

Hi Tim,

having problems with different time zones, e.g. europe vs. california doesn´t show the same days.
is this fixable?

Posted by: Thomas at August 30, 2005 02:44 PM .

timg said

The counter uses the time on the local machine using the Actionscript Date Object. To get an absolute value you would have to get the time from your server using loadVars and a PHP script, and create the Date object using those values.

Posted by: timg at August 30, 2005 07:23 PM .

timg said

NEW VERSION:

Using optional server-side PHP script, different time zones are now catered for.

Posted by: timg at April 13, 2006 09:34 PM .

David said

I tried to download the files, but it seems like the fla is for macs only. Is there a pc version at all?

Posted by: David at April 15, 2006 11:10 PM .

timg said

@david: PC / MAC shouldn't be a problem. What Flash version are you using? The .fla is (probably) saved as Flash 8, and can't be opened in a lower version.

Posted by: timg at April 16, 2006 09:21 AM .

Nick said

Hi Tim,

Great movieclip!
I got a little confused while trying to countdown to a different date than Christmas. What modifications should I make?

Thanks,
Nick

Posted by: Nick at April 25, 2006 09:59 PM .

timg said

@Nick: The date parameters are passed to flash via HTML (check the HTML source of the example page):

<param name="movie" value="fl_countdown_02.swf?yr=2006&mo=3&da=1" />

If the parameters are not present, the script defaults to Christmas. If you want a recurring countdown, leave out the year.

Posted by: timg at April 26, 2006 04:59 AM .

jess said

great script.

i have one question concerning specific hours. we want this to countdown to May 14th at 8PM ET. do we need to edit the fla source or can this be done with the html parameters? thanks alot

Posted by: jess at May 3, 2006 07:53 PM .

bsn said

@jess:

Check out the example page.

The following parameters can be passed using the flash URL:

  • Years: yr
  • Months: mo (1-12)
  • Days: da (1-31)
  • Hours: ho (0-23)
  • Minutes: mi (0-59)

Posted by: bsn at May 3, 2006 08:01 PM .

Jonathan said

How do I specify NOT to use server time. I am trying to embed a flash file that I have hosted on myserver into a myspace page, but it's not working, probably cause it's trying to read the time from the myspace server? In any case, the headache would go away if I could tell the script to use local time.

Posted by: Jonathan at May 14, 2006 01:21 PM .

bsn said

@Jonathan:

Download the latest version. I've changed the default setting to client time. To use server time, pass the name of the script to be used as an HTML variable.

Posted by: bsn at May 15, 2006 11:14 AM .

Ross said

Hello! Is there any easy way to change the background colour?
cheers

Posted by: Ross at May 21, 2006 11:31 AM .

bsn said

@Ross:

Use the normal flash parameter "bgcolor" (can be used to change the background colour of any flash movie). Check the examples page.

Posted by: bsn at May 22, 2006 10:04 AM .

charles said

When counting down to specific times, ie something the same across the globe, the timer fails to refresh with the page. After a reload, the timer resorts back to the original time it had started counting down from when the page originally loaded. This is evidenced on the further examples page as well.

Any solution?

Posted by: charles at May 23, 2006 02:32 AM .

bsn said

@charles:

hmm. not in Safari 2.0.3.
Sounds like a cache problem. The browser is using a cached version of the PHP-generated XML file, therefore giving the same start time. I've added a couple of headers the the PHP file that should prevent caching. Let me know if it works.

Posted by: bsn at May 23, 2006 09:58 AM .

Goodwin said

I can not get anything except 135 Days .....

Posted by: Goodwin at May 25, 2006 06:46 AM .

bsn said

@Goodwin

MovableType ate your markup:

<object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=7,0,19,0" width="250" height="30">
    <param name="movie" value="fl_countdown_03.swf?yr=2006&mo=6&da=8&ho=15&mi=00">
    <param name="quality" value="high">
    <embed src="fl_countdown_03.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="250" height="30"></embed>
</object>

Using the standard Macromedia Flash embed code (as you are), you have to enter the variables twice; in the param element, and in the src attribute of the embed element.

More information, and an alternative method, here: the A List Apart Flash Satay article.

Even better, an unobtrusive javascript method for embedding flash.

Posted by: bsn at May 25, 2006 10:22 AM .

charles said

bsn: problem fixed. very well done indeed.

Posted by: charles at May 28, 2006 12:13 AM .

Bolito said

could you make a coutdown to me to 18th july 2006? tkx !

Posted by: Bolito at May 28, 2006 09:19 PM .

stuck said

hi

trying to embed into a friends timeline based movie

I get

'**Error** Symbol=countdown_mc, layer=Ebene 1, frame=1:Line 82: '{' expected
startCountdown = function ( yr:Number,mo:Number,da:Number,ho:Number,mi:Number,nextYear:Boolean,timeScript:String,color ):Void'

I've tried targeting & putting into a holding clip but with no success

?

Posted by: stuck at June 17, 2006 10:31 PM .

stuck said

hi

figured it - source movie I was given was flash 5, rebuilding in flash 8 sorted it

nice code

Posted by: stuck at June 18, 2006 11:56 PM .

Rod said

Hey! I love the countdown! It's really slick. I modified the look and feel a bit.

Say.. does anyone have the DIN font family handy?

Cheers,

Rod

Posted by: Rod at June 22, 2006 09:50 AM .

Jayce said

Awesome! Made a friend a b'day countdown...

http://www.jaysonbell.co.nz/countdown/fayesfantasticalbdaycountdown.htm

Posted by: Jayce at June 28, 2006 05:55 AM .

Jan said

Hi - really love your counter.
Especially that it can be configured in any way!
One more thing and I would call it perfect :)
If you could add a parameter setting the tick-sound off - that would be nice.

Posted by: Jan at July 19, 2006 01:18 AM .

bsn said

@Jan - download the latest version (3.2). Ticking sound is now off by default.

Posted by: bsn at July 25, 2006 03:53 PM .

Jan said

bsn - thank you very much, but...:
ERROR: File does not exist! :-)


Posted by: Jan at July 25, 2006 06:00 PM .

bsn said

@Jan - my mistake. works now.

Posted by: bsn at July 25, 2006 06:02 PM .

Jason said

Perfect! I'm a complete newb at flash and I already totally customized it.

Posted by: Jason at July 25, 2006 07:54 PM .

Jan said

Hi bsn

You're quick ... but this time maybe to quick :-)
It seems that the digits don't scale anymore.
e.g. height=15 clips the digits. That didn't happened in v3_1.

You're close now, keep up the great work :o)

Kind regards Jan

Posted by: Jan at July 25, 2006 10:12 PM .

bsn said

@Jan

Don't push your luck, mate :)
Try downloading it again...

Posted by: bsn at July 25, 2006 10:16 PM .

Jan said

@bsn, he he ...
I take it all back.
You're my man - looks like it works perfect now!

Thank you once again - great work :-)

Posted by: Jan at July 25, 2006 10:22 PM .

Rob said

What is required to make the php file read the server time rather than the client time?

Thanks

Posted by: Rob at July 27, 2006 08:37 AM .

Rob said

What is required to make the gettime.php script read the server time rather than the client machine time?

thanks

Posted by: Rob at July 27, 2006 08:38 AM .

bsn said

@Rob

The php script ('gettime.php') always reads the server time, using the php mktime() function. A server-side script has no way of directly accessing the time on a client machine.

Posted by: bsn at July 27, 2006 08:41 AM .

Rob said

hmmm...well i'm based in Australia...and I've uploaded the files to a server in the USA but I'm getting the same time on my dev server as I am on US server...do I need to pass in the date variables as well as the script varible in the HTML i.e. fl_countdown_v3_2.swf?yr=2006&mo=7&da=29&ho=20&mi=00&sc=gettime.php

or am i doing it wrong? or is it just a total conincedence that the US server is running on Australian time

Posted by: Rob at July 27, 2006 08:51 AM .

lulighttec said

Hi,

Quick question. Can we alter the counter to count from a specific time to a specific time, regardless of what the local time or server time is? I would like to use something similar in a short video. Thanks so much.

-N

Posted by: lulighttec at August 25, 2006 05:57 PM .

seb said

Hi!

Thanks for this wonderful countdown! However, I have a very annoing problem. In Internet Explorer, after a refresh it looses its variables, the variables are passed through the html, ?yr=xx&da=xx... and the gettime has its prevent cache headers but still, after a refresh, the flash looses its variables and it requires a totally clean refresh without any cache for the swf to show the right numbers again, any hints to how I shall overcome this?

Br

Posted by: seb at September 22, 2006 10:42 AM .

Jon B said

Hey, why don't you use the UTC functionality of the Date object to create a 'good enough' universal countdown. You could simple have an option to pass in the time offset for the country whose timezone you want to use as the destination time.

Maybe there is a good reason you chose not to, but server time requires you to have not only php on your server - but also the ability to make sure the the time is coorect and the timezone you want.

Just a thought.

Posted by: Jon B at September 23, 2006 03:34 PM .

bsn said

@ Jon B

if you don't provide a script variable, flash uses it's in-built Date object, as you suggest.

Server time is useful if, for example, you are launching a new product at midnight, central european time. You want someone in Asia to be counting down to the same point in time, not midnight in their timezone. (Originally I only used client time, until I had to deal with a similar scenario)

(btw, it's more probable that server time is correct than the time on all of your client machines.)

Anyway - just leave out the script variable and you can use the client's clock.

Posted by: bsn at September 25, 2006 09:52 AM .

Dino said

I downloaded your zip file and went to use it but the flash file (fl_countdown_v3_2.fla) would not open in my Flash MX Pro 7.2. I'm just starting out so sorry for the novice sounding questions but I really like this script and wanted to learn it and tweak it for my site.

Any advice or help would be appreciated.

Posted by: Dino at September 27, 2006 06:04 PM .

Stan said

Hi Desk at BSN - hope all is well - sent you over an emai a few times for the last week - is there anyone behind your desk, guys? i really need you to get back as soon as you read this note - Thank you! Stan

Posted by: Stan at October 14, 2006 11:36 AM .

Rob said

is it possible to add miliseconds to this?

Posted by: Rob at October 19, 2006 06:26 PM .

Corey said

This is a great little flash app you have created! Thanks BSN!

I am however having problems getting the flash file to get the time variable from the PHP script. I have the files all on the PHP server (HTML, SWF, PHP and XML), but it isn't grabbing the time from the server. The time it is using is from the client machine. Am I missing a step? Is there some code that needs to be changed around?

Also, can this be made compatible with ASP?

Thanks for any help or direction you might be able to provide!

Corey

Posted by: Corey at October 25, 2006 11:43 PM .

Corey said

Ok, I am a bit retarded. I got the PHP to work. All I needed was to call "sc=gettime.php" in the flash tag. Works great now in PHP.

So I still am curious if this will work with ASP?

Thanks, you rock BSN!

Posted by: Corey at October 25, 2006 11:53 PM .

bsn said

Hi Corey,

should work with ASP. Important is that the script, whether it's perl, PHP, whatever, returns an XML file in the correct format.

<?xml version="1.0" encoding="utf-8"?>
<data>
  <ms>1162471379</ms>
</data>

Posted by: bsn at November 2, 2006 01:44 PM .

jsum said

hi

Fantastic timer! Quick question though > it only works when published as flash player 6. Is there any reason or quick fix to make it work as flash player 8 (i need some of v8s features)

Thanks

Posted by: jsum at November 7, 2006 12:20 PM .

bsn said

Hi jusm,

can't think of any reason why it shouldn't work as flash 8. I'll look into it.

Tim.

Posted by: bsn at November 7, 2006 12:25 PM .

jsum said

bsn

thanks v much. It is odd. I change my publish settings to player 6 and it works beautifully. Change them to player 7 or 8 and I get an error message:

Error opening URL "file:[filepath]/undefined"

Posted by: jsum at November 7, 2006 01:55 PM .

chris said

I'm having a bit of trouble in that Firefox is displaying the wrong amount of time remaining , whereas Explorer is getting it correct.... any ideas anyone???

Posted by: chris at November 16, 2006 12:45 PM .

chris said

ignore previous comment i've sorted it. cheers

Posted by: chris at November 16, 2006 01:31 PM .

mike said

Great timer, just what I was looking for. Only trouble is I'm having the same problem as jsum trying to output to player v7 or 8, only works output to v6. Any luck with a fix for this?

Posted by: mike at November 17, 2006 10:50 AM .

bsn said

@Mike, jsum

I see what you mean. Try using the new version (3.3).

Cheers,
Tim.

Posted by: bsn at November 17, 2006 12:25 PM .

jsum said

Tim, that's fantastic. Many thanks!

Posted by: jsum at November 17, 2006 01:01 PM .

mike said

Brilliant! Thanks for your speedy response and fix.

Posted by: mike at November 17, 2006 01:38 PM .

paul said

hey.

that's a piece of beauty.

but i have some troubles using it. in my fla i make a new movie clip and import your countdown_mc. i give it an instance name...and then use the same code as your to start the countdown...

but it doesn't seem to work :(((

did i miss something?

thanks

Posted by: paul at December 6, 2006 10:28 AM .

paul said

hey. still me.

i made some digin'

what i discovered? if i want in the same frame to start de counter it fails. it seems it needs two frames..:(

at least this is how i made it work, but just once :(((

cheers

Posted by: paul at December 6, 2006 01:32 PM .

bsn said

Hi Paul.

Yup. Because the counter is just a movie clip, and not an actual class, the clip needs to be loaded one frame before (like in the example). Otherwise the functions in the clip aren't instantiated.

Tim.

Posted by: bsn at December 6, 2006 01:39 PM .

Jan said

I can't seem to get to work the timer using my server time.
Upon viewing the counter, the counter always starts back at the same time, being 300 days, 17 hours.

this is my code:



It's driving me nuts ...

Posted by: Jan at December 28, 2006 04:35 PM .

jan said

this is the code i was talking about:

<object type="application/x-shockwave-flash" data="fl_countdown_v3_3.swf?mo=3&da=27&snd=on&sc=gettime.php" width="250" height="60">

<param name="movie" value="fl_countdown_v3_3.swf?mo=3&da=27&snd=on&sc=gettime.php" />

</object>

Posted by: jan at December 28, 2006 04:36 PM .

Terry said

No matter what I do, I cant get round the british summer time issue. If I put in an end date of april 5, the clock now is one hour behind. But when it goes to british summertime the hours are corrected. Any ideas I am desperate

Thanks in advance

Posted by: Terry at March 1, 2007 10:01 PM .

Jason said

Use the embed source.

Example....

Posted by: Jason at March 11, 2007 10:02 PM .

Matthew Rackham said

Hi,

I have a strange problem, if I navigate to http://myurl.com the flash file won't computer the numbers. It's blank.

However, if I navigate to http://www.myurl.com it works perfectly!

Why would that be?

Strange!!

Posted by: Matthew Rackham at March 26, 2007 06:25 AM .

Mike said

Hi,

I like what you did with this countdown timer. I have been trying to figure out a way to do something similar here, but am lost. I wrote a PHP script that detects the server time and based on that time displays a certain image (jpg file). For example, at 1PM - The image is example1.jpg. At 2PM, the image is swapped out with example2.jpg. Now, this works great using php and javascript, but the thing I don't like is the "refresh" of the page/image that I had to code (eveery 60 secs) in order to continuously go out and fetch the server time. What I'd like to do is place these images in flash and use the gotoAndPlay actionscript to have a smooth transition from one image to the next without any refresh. Like so: Have flash continuously check the time either via the PHP script or thru actionscript. Depending on the time, say if it's 1PM, gotoAndPlay frame 2 (contains an image) and continuously check the time again, when it's 2PM, gotoAndPlay frame 3 and continously check the time, etc... I apologize for the long post, but it definitely looks like you guys know what you're doing here. Thanks!

Posted by: Mike at April 4, 2007 02:52 PM .

Danne said

Please help :)

I use the gettime.php, and it works, but not when i change the timezone, is there away to disable so it wont read the local timezone?

Posted by: Danne at April 4, 2007 04:45 PM .

Lea Medeiros said

I can't open the .fla in teh zip file. MX2004 gives me an unexpected file format error message.... Is this me or the file?

I'm on a PC (XP Pro) using MX2004.

Posted by: Lea Medeiros at April 4, 2007 05:38 PM .

Thomas said

Hi love the code. Was wondering I need to make the counter count down to lets say now to May 31st 2007 and stop. Is this possible.

Cheers. Tom

Posted by: Thomas at April 9, 2007 05:10 PM .

Pierre-Marc said

Hi, was so simple to use. I have same question as Thomas, is it possible to make it stop after hiting 0, and not go to next year date with a simple way to edit it? Or is it possible to ad another date after, i mean like once the counter set to 0, it can go to next weekend event at a date i will set? Is it simple to do?

Thank

Posted by: Pierre-Marc at April 11, 2007 04:54 PM .

Martín said

Muchas Gracias, me sirvio de mucho este codigo.

Posted by: Martín at April 18, 2007 09:18 PM .

Kiddi Geir said

thanx for this one ... good stuff.

one question: where can I change the time-digit colors ?

can't find it when i open up the .fla, only the days-hours-min text! and of course I can chance the background color. Does anyone know this ?

sincerly, Kiddi

Posted by: Kiddi Geir at May 7, 2007 01:53 PM .

Kiddi Geir said

ok found it under ctrl+f (find) and "color"

changed the #hex color and works fine

thanx!

Posted by: Kiddi Geir at May 7, 2007 03:56 PM .

Duckie said

Wonderful scripting. Thanks for creating this. One question, tho: I would like to have the SWF go to another scene when the counter reaches zero. How would I go about accomplishing this? (Thanks again!)

Posted by: Duckie at May 12, 2007 09:03 AM .

Badg35 said

Works like a charm and easy to edit! Thanks a bunch for a great script!!

Posted by: Badg35 at May 14, 2007 09:19 PM .

sicou said

hi,
i only have flash MX for mac.
can someone save it in this format??plzzzzzzz

Posted by: sicou at June 12, 2007 10:48 AM .

Sam said

The minutes are not counting down correctly. I'm trying to count down to 22:30. Adding the minute variable (mi=30) does not affect the countdown.

fl_countdown_v3_3.swf?yr=2007&mo=7&da=20&ho=22&mi=30

displays the exact time left as:

fl_countdown_v3_3.swf?yr=2007&mo=7&da=20&ho=22&mi=0

Any ideas? Thanks!

Posted by: Sam at June 14, 2007 04:08 PM .

Vy said

Hi,

How do you make it so that after the movie clip has finished counting down, it goes to a different frame or scene.

Kind Regards
Vy

Posted by: Vy at July 6, 2007 06:36 PM .

Harry said

Hello, im developing a flash program where i load a picture from any URL into a MovieClip, BUT before i want it to get loaded. i want to check if the URL even exists so that a specific algorithm can take place before the file loads or before an error occurs if it DOES NOT EXIST.

PLEASE HELP ME huhuhuhuhuhuhuhu........ i searched for hours.... a complete waste of time...

Posted by: Harry at August 13, 2007 09:42 AM .

Harry said

Hello, im developing a flash program where i load a picture from any URL into a MovieClip, BUT before i want it to get loaded. i want to check if the URL even exists so that a specific algorithm can take place before the file loads or before an error occurs if it DOES NOT EXIST.

PLS I NEED SOME HELP.... huhuhuhuhuhuhu...

Posted by: Harry at August 13, 2007 09:43 AM .

Scott said

Having some issues with it - it isn't displaying the right amount of time to the countdown date.

The only thing i have modified is the HTML date details as follows




with this data it displays "193 days" which is obviously wrong.

the date i am trying to display the countdown to is:
21/12/2012 and the 11th hour and 11th minute.

any help appreciated!

Posted by: Scott at September 6, 2007 12:12 PM .

Scott said


sorry the code didnt display, the swf swction looks like:

fl_countdown_v3_3.swf?yr=2012&mo=12&da=21&ho=11&mi=11

Posted by: Scott at September 6, 2007 12:14 PM .

William said

Brilliant, brilliant, brilliant. Easy to set up (once I'd realised that the & in the HTML was just '&'!) Thanks very much indeed.

Posted by: William at September 7, 2007 04:26 PM .

Arczhidea said

Is there a possibility of using this code, but changing the source images? Such as I want a background image, I want to change the Days, Hours, Mins, and Secs images, and I want to change the source images for the numbers, as well as add slashes between the numbers. Is this feasible?

Posted by: Arczhidea at October 16, 2007 07:06 PM .

Dean Miller said

great little Flash device!! Is there a way to play an event after the timer has counted down? Maybe like fireworks or something? I took out the stop event and that wasn't the answer.

Thanks!!!! :)
Dean

Posted by: Dean Miller at October 20, 2007 08:25 PM .

dean said

Dean Miller said

great little Flash device!! Is there a way to play an event after the timer has counted down? Maybe like fireworks or something? I took out the stop event and that wasn't the answer.


Thanks!!!! :)
Dean

Posted by: dean at November 1, 2007 10:25 AM .

MvsB said

i want that when the countdonw finished, show a text area with random texts.
How could i do this?

thanks.

Posted by: MvsB at November 5, 2007 04:34 PM .

Justin said

Here is a conversion of GETTIME.PHP to GETTIME.ASPX (ASP.NET C#)

You'll have to add the >'s and
... this is kind of a crappy message board..
--------------------------------------

%@ Page Language="C#" ContentType="text/html" ResponseEncoding="utf-8" Debug="true" %
script runat="server" type="text/c#"

protected void Page_Load(object sender, EventArgs e){
//Get the current time on the server by getting seconds between 1970 and today (PHP equivilant is 'mktime()')
TimeSpan ts = DateTime.Now.AddHours(6) - Convert.ToDateTime("1/1/1970 00:00:00.000");
double totalMs = ts.TotalSeconds;
ltlDTA.Text = Convert.ToString(Math.Round(totalMs));
}
/script
?xml version="1.0" encoding="utf-8"?
data
ms
asp:Literal runat="server" Text="" id="ltlDTA"
/asp:Literal
/ms
/data

Posted by: Justin at November 7, 2007 09:52 PM .

Allison said

This is great. Thank you

Posted by: Allison at November 26, 2007 05:57 PM .