We help IT Professionals succeed at work.

Javascript Clock **URGENT EASY 500 POINTS**

TheMaximumWeasel
on
Medium Priority
228 Views
Last Modified: 2007-12-19
I need a javascript clock. I want it to display the time like this:

5:35pm April 4, 2006

but instead of getting the time and date from the user's computer I want to have it start at a date and time that I specify. Also I want it to count so on the page it is live and it isn't in a text box it is just plain text.

Max
Comment
Watch Question

Commented:
<html>
<head>
<title>Lakio's Timemover</title>
<script>
var when = new Date('5:35pm April 4, 2006'); // just insert the date and time here

function clock(){
var mo=['January','February','March','April','May','June','July','August','September','October','November','December'];
var ap=when.getHours()?'pm ':'am ';
var ho=when.getHours(); ho=ho>12?ho-12:ho;

document.getElementById('clock').innerHTML=ho+when.toUTCString().match(/:\d\d/)+ap+mo[when.getMonth()]+' '+when.getDate()+', '+when.getUTCFullYear();

when=new Date(Date.parse(when)+60000);
}
</script>
</head>
<body onload="clock();self.setInterval('clock()', 60000);">
<div id="clock"></div>
</body>
</html>

Not the solution you were looking for? Getting a personalized solution is easy.

Ask the Experts
CERTIFIED EXPERT

Commented:
Lakio's answer is OK, however I suggest that the time be updated every second instead:

<body onload="clock();self.setInterval('clock()', 1000);">

Commented:
btw: its set for every min
CERTIFIED EXPERT

Commented:
I know, but you want it to be accurate to the second...

Commented:
if we are displaying min not sec we dont need that,

new Date('5:35pm April 4, 2006')
is the same as new Date(2006, 3, 4, 17, 35, 0, 0) (yr_num, mo_num, day_num , hr_num, min_num, sec_num, ms_num)
so sec are set a 0 ok!?

and sins the next min is after 60sec its no need to run the script 60times for nothing,
thats just becuse we dont show sec but if we did then we would run it every sec.

In short: It is accurate to the second
CERTIFIED EXPERT

Commented:
But the first time the script is run, the update will be between 60 secs to 119 seconds.

Commented:
"But the first time the script is run, the update will be between 60 secs to 119 seconds."
I dont understand your point but here is a script that is very very accurate.

and still just runs every min

On page load the time is set to '5:35pm April 4, 2000' and it does not matter how often the script is run or if the cpu is under alot of load. the time is connected the the cpu clock so its alwas "running".


<html>
<head>
<title>Lakio's Timemover v2.0</title>
<script>
diff = new Date()-new Date('5:35pm April 4, 2000'); // just insert the date and time here
function clock(){var when=new Date(new Date()-diff);
var mo=['January','February','March','April','May','June','July','August','September','October','November','December'];
var ap=when.getHours()?'pm ':'am ';
var ho=when.getHours(); ho=ho>12?ho-12:ho;

document.getElementById('clock').innerHTML=ho+when.toUTCString().match(/:\d\d/)+ap+mo[when.getMonth()]+' '+when.getDate()+', '+when.getUTCFullYear();
}
</script>
</head>
<body onload="clock();self.setInterval('clock()', 60000);">
<div id="clock"></div>
</body>
</html>
CERTIFIED EXPERT

Commented:
ok, won't argue... cos it still generally works. It was just a suggestion in the first place.

Author

Commented:
I already found one online and edited it for my  site so I will split all of the points to the people who provided an acceptable answer
Access more of Experts Exchange with a free account
Thanks for using Experts Exchange.

Create a free account to continue.

Limited access with a free account allows you to:

  • View three pieces of content (articles, solutions, posts, and videos)
  • Ask the experts questions (counted toward content limit)
  • Customize your dashboard and profile

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.