1. Computing & Technology

Multiple Analog Clocks

4. Configuration

clr gif
Join the Discussion

Questions? Comments?

There are quite a number of different ways that you can configure each analog clock created by this script. The options and the effect that each has are identical to those of my original Analog Clock script. Note that you should consider smaller clock sizes when putting more than one clock on the same page.

The one option this script now allows that the original script didn't is to hide the second hand on a clock. You do this by setting the colseconds field to false.

Where the configuration differs is that you now have to add a call to the end of the configuration script for each of the clocks that you want to create passing it all of the configuration options for that clock. One such call is provided in the supplied code and looks like this:

new clock('a',clocksize,colnumbers,colseconds,colminutes,
colhours,numstyle,font_family,localZone,mytimezone,dst,city,
country,fix,xpos,ypos);

As written the configuration file first assigns values to each of the configuration options and then creates a clock using them by passing all of the variables as parameters in this statement. The 'a' in the first parameter indicates that this clock will update the div on the page that has an id of "clock_a".

Working it this way makes it easier to add the second and subsequent clocks. All that you need to do is to repeat this piece of code and change the first parameter to refer to the div where the next clock is to be placed. You then add the necessary code between the two pieces of code to change the values of just those parameters that need to be different for the second clock. Those values which are the same for both (all) clocks are assigned once at the start and do not need to be reassigned.

So if our first clock displays local time and we want the second clock to display identically but displaying GMT and no second hand we only need to add the following code:

localZone = 0;
city = 'GMT';
colseconds = false;
new clock('b',clocksize,colnumbers,colseconds,colminutes,
colhours,numstyle,font_family,localZone,mytimezone,dst,city,
country,fix,xpos,ypos);
Introduction | Head Script | Positioning the Clock(s) | Configuring the Script

©2012 About.com. All rights reserved.

A part of The New York Times Company.