Improved Author Local Time

2. Get the Script

The first step in using this script is to select the code from the text box below (there is a highlight all button beneath it to make this easier) and copy it into a file called datetime.js.

// display current date and time at author location // ======================================= // copyright Stephen Chapman, Felgall Pty Ltd, 11 July 2001, 25th November 2004, 12th October 2006 // http://www.felgall.com/ and http://javascript.about.com/ // permission is given to use this script // provided that all comment lines in the script are retained function myTime() { var dst = 0; // set to 1 for daylight savings time // update this as you go on and off daylight saving time var loc = 'Sydney, Australia'; // set to your location var mtz = 10; // set to your local timezone (hours ahead of UTC, negative if behind) var stdz = 'AEST'; // standard time indicator var dayz = 'ADST'; // daylight saving time indicator (blank if you dont have daylight saving) var showDate = 1; // 0 = don't show, 1 = international format, 2 = US format // do not alter anything below this line var newP = document.createElement("span"); var txt = 'The time in ' + loc + ' is '; var newT = document.createTextNode(txt); newP.appendChild(newT); var newP2 = document.createElement("span"); newP2.id = 'time'; var txt2 = setDsp(mtz,dst,stdz,dayz,showDate); var newT2 = document.createTextNode(txt2); newP2.appendChild(newT2); var frag = document.createDocumentFragment(); frag.appendChild(newP); frag.appendChild(newP2); var d2 = document.getElementById('datetime'); d2.parentNode.replaceChild(frag,d2); setTimeout('updDsp('+mtz+',' +dst+',"' +stdz+'","' +dayz+'","'+showDate+'")', 5000);} var pageLoaded = 0; window.onload = function() {pageLoaded = 1;} function loaded(i,f) {if (document.getElementById && document.getElementById(i) != null) f(); else if (!pageLoaded) setTimeout('loaded(\''+i+'\','+f+')',100); } function updDsp(mtz,dst,stdz,dayz,showDate) {var obj = document.getElementById('time'); obj.firstChild.data = setDsp(mtz,dst,stdz,dayz,showDate); setTimeout('updDsp('+mtz+ ','+dst+ ',"'+stdz+ '","'+dayz+ '","'+showDate+'")', 5000);} function setDsp(mtz,dst,stdz,dayz,showDate) {var dayname = ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday','Friday', 'Saturday']; var month = ['January','February','March','April','May','June','July','August','September','October','November','December']; var now = new Date; now.setUTCMinutes(now.getUTCMinutes() + (mtz + dst)*60); var dow = now.getUTCDay(); var minute = now.getUTCMinutes(); var hour = now.getUTCHours(); if (hour > 11) {ampm = 'PM'; hour -= 12;} else {ampm = 'AM'} if (hour == 0) {hour = 12;} if (minute < 10) {pad = ':0';} else {pad = ':';} var txt = hour + pad + minute + ' ' + ampm + ' ('; if (dst) txt += dayz; else txt += stdz; txt += ') on ' + dayname[dow]; if (showDate == 1) txt += ' ' + now.getUTCDate() + ' ' + month[now.getUTCMonth()] + ', ' + now.getUTCFullYear(); if (showDate == 2) txt += ' ' + month[now.getUTCMonth()] +' ' + now.getUTCDate() + ', ' + now.getUTCFullYear(); return (txt); } loaded('datetime',myTime);

You next attach the script into your web page that you wish to display your timezone information on by adding the following code into the head section of your page.

You also need to add a small piece of code into the body section so that the script knows where you want your location and local time to be displayed. The script will replace this code with two spans one containing the location information and the second containing the time and optionally the date. This second span uses id="time" to identify itself so the script can dynamically update it so you will need to avoid using that id elsewhere in your page.

The next step is to Configure the Script to work with your local timezone.