How to put a Count system clock on a web page ?

johnpau80 · Jan 10, 2006

I wanted to design a web page in html where it should
display just a count down clock for me.

How can I do that ?

Ex:- I have an competition coming up for my school sports
and its on Feb 5th at 10:00AM.

So when users login to my webpage it should check the
current system clock(PC) and then subtract from the above
date and show it in hours or days.(including minutes).

Any help !!!!!!

--THanks
SAM

manarth · Jan 10, 2006

Code:

var today = new Date();
var endDate = new Date(2006, 01, 05, 10, 0, 0);

and a whole bunch more date code info.

(By the way - that '01' is february - the months start at 0=january.)

---
Marcus
better questions get better answers - faq581-3339
accessible web design - zioncore.com

johnpau80 · Jan 10, 2006

Hey thanks for the info, but I am new to this web stuff.

Can you tell me as how to write a basic html page displaying the count down clock.

--Thanks

manarth · Jan 10, 2006

Tek-Tips is best used for answering specific questions - if you're a complete beginner you'll find much better sites for learning how to get started.

Googling learn html is a good start, and the top link is to the W3C (World Wide Web Consortium)'s HTML tutorial. The W3C site also has tutorials on CSS and JavaScript - both of which should be used for this example.

In it's simplest form, your HTML will be:

Code:

<!DOCTYPE html PUBLIC
	"-//W3C//DTD XHTML 1.0 Strict//EN"
	"[URL unfurl="true"]http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">[/URL]

<html lang="en-gb" xml:lang="en-gb">
<head>
	<title>Countdown Clock</title>
	<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

	<link type="text/css" href="[COLOR=blue]styles.css[/color]" rel="stylesheet" />
	<script type="text/javascript" src="[COLOR=blue]countdownClock.js[/color]"> </script>

</head>

<body>
	<h1>Counting Down</h1>
	<div id="countdown"></div>
</body>
</html>

The html itself is basic; this code calls 2 additional files: styles.css which would define how the content appears (colours, etc) and countdownClock.js which would provide the javascript to generate the countdown clock.

---
Marcus
better questions get better answers - faq581-3339
accessible web design - zioncore.com

Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

How to put a Count system clock on a web page ?

johnpau80

IS-IT--Management

manarth

Programmer

johnpau80

IS-IT--Management

manarth

Programmer

Similar threads

Part and Inventory Search

Sponsor