|
Using JavaScript we can create a clock like the one shown here:
Creating the clock requires three parts: first putting the script in the HEAD part of the page, secondly creating a form to show the time, and lastly starting the script when the page loads by using the method onLoad in the BODY tag.
Clock Script
Here is the code for the JavaScript clock. Make sure to place it in the HEAD part of your document. This code can be copied and pasted.
<SCRIPT LANGUAGE="JavaScript" TYPE="text/javascript">
<!-- Clock --
var timerID = null
var timerRunning = false
function stopclock() {
if(timerRunning)
clearTimeout(timerID)
timerRunning = false
}
function startclock() {
stopclock()
showtime()
}
function showtime() {
var now = new Date()
var hours = now.getHours()
var minutes = now.getMinutes()
var seconds = now.getSeconds()
var timeValue = "" + ((hours > 12) ? hours
- 12 : hours)
timeValue += ((minutes < 10) ? ":0" : ":")
+ minutes
timeValue += ((seconds < 10) ? ":0" : ":")
+ seconds
timeValue += (hours >= 12) ? " PM"
: " AM"
document.clock.face.value = timeValue
timerID = setTimeout("showtime()",1000)
timerRunning = true
}
//-->
</SCRIPT>
Creating the Form
We need to create a form named "clock" to show the time. Put the following code on your page where ever you want your clock to be shown.
<FORM NAME="clock" onSubmit="0">
<INPUT TYPE="text" NAME="face" SIZE=11
VALUE="..Initializing..">
</FORM>
Running the Script
In order to get the clock to run, we need to load the script when the page loads:
<BODY onLoad="startclock()">
This page has been accessed
 
times since June 24, 2001
Last Updated March 23, 2001
|
