This is a php initiated javascript clock.
After seeing many requests for such an example,
and needing one myself at one time…
The justification for php clock initiation is that while
this script depends on the client’s time zone setting,
server clock settings are used rather than the client’s clock settings.
Suggestion: extend script with a drop down list
to show time in any given time zone or city…
<html>
<head>
<title>clock</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<script language="JavaScript">
// Note: m-1 to account for javascript Date() syntax
var timesetter = new Date(<?php echo gmdate("Y,m-1,d,H,i,s");?>);
var day = new Array('Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday');
var month = new Array('January', 'February', 'March', 'April', 'May', 'June', 'July', 'August', 'September', 'October', 'November', 'December');
var ZoneOffsetMSeconds = timesetter.getTimezoneOffset()*60*1000;
// adjust time to client's time zone
// Note: client might have bad time zone settings
timesetter.setTime(timesetter.getTime()-ZoneOffsetMSeconds);
var TimeNow = "";
function MakeTime(){
setTimeout("MakeTime();",1000);
timesetter.setTime(timesetter.getTime()+1000);
var mthN = String(timesetter.getMonth());
var mth = month[mthN];
var mthday = String(timesetter.getDate());
var yrN = String(timesetter.getFullYear());
var dayN = String(timesetter.getDay());
var dd = day[dayN];
var hhN = timesetter.getHours();
if(hhN > 12){
var hh = String(hhN - 12);
var AP = "pm";
}else if(hhN == 12){
var hh = "12";
var AP = "pm";
}else if(hhN == 0){
var hh = "12";
var AP = "am";
}else{
var hh = String(hhN);
var AP = "am";
}
var mm = String(timesetter.getMinutes());
var ss = String(timesetter.getSeconds());
TimeNow = "<font face='Arial, Comic Sans MS' size=3 color=#99FF00>" + dd + " </font><font size=5 color=#99FF00> <tt>" +((hh < 10) ? " " : "") + hh + ((mm < 10) ? ":0" : ":") + mm + ((ss < 10) ? ":0" : ":") + ss + "</tt></font><font face='Arial, Comic Sans MS' size=3 color=#99FF00>" + AP + " " + mth + " " + mthday + ", " + yrN + "</font>";
return TimeNow;
}// end function MakeTime
function ShowClock(){
setTimeout("ShowClock();",1000);
WriteToLayer('clock','<table width="450" border="5" cellspacing="0" cellpadding="0" bgcolor="#000000" bordercolor="#666666" ><tr><td align="center" valign="middle"><hr width="350" size="1" align="center" color="red">' + TimeNow + '<hr width="350" size="1" align="center" color="red"></td></tr></table>');
}// end function ShowClock
function WriteToLayer(ID,WriteThis) {
if (document.layers){
lyr=document.layers[''+ID+''].document;
lyr.open();
lyr.write(WriteThis);
lyr.close();
}
else if (document.all){
document.all[''+ID+''].innerHTML = WriteThis;
}
else if (document.getElementById){
range = document.createRange();
element = document.getElementById(''+ID+'');
range.setStartBefore(element);
content = range.createContextualFragment(WriteThis)
while(element.hasChildNodes()) element.removeChild(element.lastChild);
element.appendChild(content);
}
}// end function WriteToLayer
</script>
</head>
<body bgcolor="#FFFFFF" text="#000000" onLoad="MakeTime(); ShowClock()" leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="clock" style="visibility:visible; position:absolute; width:450px; height:60px; background-color:#000000; layer-background-color:#000000; z-index:1; left: 10; top: 10">
</div>
</body>
</html>
