<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"><html><head>

<script type="text/javascript">
var scaleFactor=1; //for enlarging or shrinking the whole clock
var faceBackgroundColour="#f0f0f0";
var faceBorderColour="#606060";
var faceRadius=100;
var faceBorderWidth=8;
var initialLineColour="#606060"; //the initial line being the line from the centre of the face to "0"
var dotColour="black"; //the dot being the circle in the centre of the face
var initialLineWidth=1; //removes the initial line if set to 0
var dotRadius=5;
var clockNumbers=new Array("0","π/6","π/3","π/2","2π/3","5π/6","π","−5π/6","−2π/3","−π/2","−π/3","−π/6");
var numbersColour="black";
var numbersFontStyle="Times New Roman";
var numbersFontSize=14; //in px
var hoursHandColour="black";
var minutesHandColour="black";
var secondsHandColour="black";
var hoursHandWidth=4;
var minutesHandWidth=2;
var secondsHandWidth=1;
//These are expressed as fractions of the face's radius:
var hoursHandLength=0.5;
var minutesHandLength=0.65;
var secondsHandLength=0.7;
var secondsHandExtensionLength=0.2; //the extension of the seconds hand in the direction opposite to which it is pointing
//These relate to the positioning of the numbers:
var horizontalShift=0.2;
var radialShift=1.2;
</script>

<script type="text/javascript" src="clock.js"></script>

</head><body>

<div id="clock" style="position:relative;"></div><p>

Paste this into the &lt;head&gt; section of the document:<br>
<textarea onfocus="this.select();"><script type="text/javascript">
var scaleFactor=1; //for enlarging or shrinking the whole clock
var faceBackgroundColour="#f0f0f0";
var faceBorderColour="#606060";
var faceRadius=100;
var faceBorderWidth=8;
var initialLineColour="#606060"; //the initial line being the line from the centre of the face to "0"
var dotColour="black"; //the dot being the circle in the centre of the face
var initialLineWidth=1; //removes the initial line if set to 0
var dotRadius=5;
var clockNumbers=new Array("0","π/6","π/3","π/2","2π/3","5π/6","π","−5π/6","−2π/3","−π/2","−π/3","−π/6");
var numbersColour="black";
var numbersFontStyle="Times New Roman";
var numbersFontSize=14; //in px
var hoursHandColour="black";
var minutesHandColour="black";
var secondsHandColour="black";
var hoursHandWidth=4;
var minutesHandWidth=2;
var secondsHandWidth=1;
//These are expressed as fractions of the face's radius:
var hoursHandLength=0.5;
var minutesHandLength=0.65;
var secondsHandLength=0.7;
var secondsHandExtensionLength=0.2; //the extension of the seconds hand in the direction opposite to which it is pointing
//These relate to the positioning of the numbers:
var horizontalShift=0.2;
var radialShift=1.2;
</script>

<script type="text/javascript" src="clock.js"></script></textarea><br>
Fiddle with the variables to change the clock's appearance.<p>

Paste this where you want the clock to go:<br>
<textarea onfocus="this.select();"><div id="clock" style="position:relative;"></div></textarea><p>

Right-click and "Save Target As..." to save this to the document's directory:<br>
<a href="clock.js">clock.js</a><p>

There is also a php version which uses the time on server's computer instead of the time on the computer of the person viewing the webpage.

</body></html>