views:

236

answers:

3

Hi designers/developers, I am looking for a way of graphically showing a countdown. I am working for a large Hospital and have written an Ambulance page that shows ambulance arriving in a datagrid with the time of arriving at the hospital in minutes and seconds (plus other info). They have asked me for somehow visually representing the information, so it fits with there other visually appealing Emergency Department web application (e.g. progress bar or something better):

1) Can somebody show me (visually appealing) design examples on how this could be done 2) Are there solutions in .Net (ASP.net or JQuery or Javascript) since this is our preferred technology

Thanks so much!

A: 

Here is a jquery example: http://keith-wood.name/countdown.html

Dustin Laine
I have seen that before. Thanks. I am looking for more of a graphical solution and not the numbers. Some kind of coloring that indicates so many minutes to arrival. Thanks again.
Eduard Schlechtinger
Just to clarify, something like a green box when over 5 minutes, yellow when 1 to 5 minutes and red when under a minute?
Dustin Laine
Yes that would be great or the whole bar would represent 100 minutes and the filling would give you an understanding on how far the ambulance is out. This has to work for several ambulances. THANKS
Eduard Schlechtinger
I would really appreciate seeing some visually appealing examples
Eduard Schlechtinger
A: 

Off the top of my head:

Represent the ambulance time as a colored div. Then every second or two (via setTimeout() in javascript) readjust the width of the bar and/or change the style as you reach certain time thresholds (ie; 5m left bar goes from yellow to green).

Jason Slocomb
A: 

I am looking for a countdown which can run for 120 seconds and then halting for 1 second and restarts again from 120.

Any clues.

Johnson