JavaScript Components: Clocks

Doing several Clocks with hopefully not too much overhead
See link next to each clock.

ArtDHTML provides a nifty digital clock that users can set the font style, spacing, and size for. And of course because you have the code you can also spiff it up. It uses CSS and setInterval(timer) as do most of our clocks..
English Clock by Adam Brown - provides an approximate reading of the current time. Its style is very, well English ,in the best sense of the word.
Advancing clock by JSMaster - allows users more control over time styling
Dynamic Drive and Kurt Grigg created the the Analog clock that floats in the lower right corner of this page
CodeLifters are the good people who provided the Date + Time in the Title bar (or its down in the status bar if you are using an IE or NS 4 or earlier browser - shame shame).

Boy did we have fun trying to get all the clocks to work. First, the old cross browser ugly reared its head in several instances of clocks that demo nicely but don't want to work in a complete set of browsers - IE5-8, NS?, Firefox, Opera, and Safari. The second problem we had was the interference between the setTimeout() and/or setInterval() commands between routines. Be sure to check to make sure all the variables are unique, ditto for CSS. For example, we could get several clocks to work well on their own but then they did not want to co-operate when on display with 2 or 3 other clocks. Now this latter case is an important matter because developers can easily have more than one setTimeout() or set Interval() command if there any animations, timings scripts, or timeout events. So be sure to check these potential JavaScript timer conflicts carefully.

Top of Page  Tutorials Home  Javascript References  JavaScript Books
©Imagenation 2000-2009