The Digital Research Initiative
The University of North Carolina at Chapel Hill

JavaScript for any occasion

Time Displays

These two short scripts are easy to use and don't rely on the server the way their SSI counterparts do.

Last Modified

This script displays the date and time you last made a change to your page. It's really good to have if you don't like having all your page's filenames end with .shtml (like this one, for example). This script goes wherever you want it to show up on your page, usually at the bottom.

<script>
<!--
var dlu = new Date(document.lastModified);
document.write("<b><i>Date Last Updated:</i> ")
document.write(dlu.toGMTString() + "</b>");
// -->
</script>

Here's the script at work:

Of course, if that doesn't work, you can always bite the bullet, end all your files with .shtml, and use this SSI command instead:

<!--#echo var="LAST_MODIFIED"-->

Current Time

There's two ways you can do this: display the current time in you page or down in the status bar. By far, the status bar time is much cooler because it won't take up any room in your page and people will think, "Wow, this girl is a real hack! How did she do that?"

To display the time in you page, include this script between the </title> and the </head> tags.

<script>
var timerID = null;
var timerRunning = false;
function stopclock () {
  if(timerRunning)
  clearTimeout(timerID);
  timerRunning = false;
}
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) ? " P.M." : " A.M."
  document.clock.face.value = timeValue;

  timerID = setTimeout("showtime()",1000);
  timerRunning = true;
}
function startclock () {
  stopclock();
  showtime();
}
</script>

Add this to your <body> tag:

<body onLoad="startclock(); timerONE=window.setTimeout">

And now, put this where you want the clock to show up:

<form name="clock" onSubmit="0">
<input type="text" name="face" size=13 value="">

Here's the script at work:

If you want to have the time pop up in the status bar instead, go back to the script that's located in the <head> and replace this line:

document.clock.face.value = timeValue;

with this line:

window.status = timeValue;

Remember, you can only do one at a time. You can't have the time pop up on the page and the status bar. One or the other (go for the status bar).


This site made by

By the time I get to Arizona...

This site was created especially for students of the UNC School of Journalism's
JOMC 050 Class, and anyone else who may be interested.
For more information, please contactdaikat@email.unc.edu
Last Updated: Thursday, 10-Dec-1998 13:05:04 EST