1. Tech

Your suggestion is on its way!

An email with a link to:


was emailed to:

Thanks for sharing About.com with others!

Multiple Analog Clocks

1. Introduction

When I wrote my Analog Clock script I made as much of it user configurable as possible so that it would be suitable for the widest use. The one thing I didn't cater for was being able to place more than one such clock on the same web page. What was the first thing anyone wanted to do with it? Put two clocks on the one page of course.

Modifying the script to allow for more than one clock on the same page involved significant changes to the script. The only part of the setup that this multiple analog clock script shares with the earlier single clock per page version is that all of the options to customize the appearance of the clocks are the same. This multi-clock version of the script can of course also be used where only one clock is required as an alternative to using the other script.

So here is an example of the what this script can do with the larger clock displaying your local time and the smaller clocks displaying the time where I am as well as GMT. I have changed some of the options for each clock but kept the colours the same. There is nothing to stop you making each clock completely different colours as well if you want to.

One point to note when using this script to display more than one clock is that the script will run slower as you add more clocks or make the clocks bigger the clocks will of course still jump to the right time when they update but the Mozilla based browsers in particular (eg. Firefox) becomes very slow if you have more than three clocks or make them much bigger than I have here.

The script has now been modified to reduce the problem if it overloading the browser. You can now hide the second hand on individual clocks and if you hide the second hand on all the clocks it will reduce the time between updates from every half second to every 30 seconds.

If you want to add more than one analog clock for a web page on your site then the first step is to obtain the script and install it into your web page. After you have done that we will look at how you can configure it.

Related Video
Make a PowerPoint Multiple Choice Quiz

©2016 About.com. All rights reserved.