News
Forums
Fun & Games
Buy the Book
Search Enter your search terms Submit search form

Book Resources
⊕ Scripts
- All Scripts
- Chapter 1
- Chapter 2
- Chapter 3
- Chapter 4
- Chapter 5
- Chapter 6
- Chapter 7
- Chapter 8
- Chapter 9
- Chapter 10
- Chapter 11
- Chapter 12
- Chapter 13
- Chapter 14
- Chapter 15
- Chapter 16
- Chapter 17
FAQ
Errata
⊕ Excerpts
- Table of Contents
- Sample Chapter
⊕ Where to Learn More
- Sites
- Newsgroups
- Books
⊕ Previous Editions

The Workbench
Articles
Useful Scripts

Chapter 13: Making Your Pages Dynamic

Contents:

Putting the Current Date into a Web Page
Working with Days
Customizing a Message for the Time of Day
Displaying Dates by Time Zone
Converting Military Time to A.M./P.M.
Creating a Countdown
Moving an Object in the Document

Return to Chapter 13

To use this script on your own page, click in the text area below, select all, and copy to grab the script. Then, just paste into your own page — and you're done.

Displaying Dates by Time Zone

See it run: Displaying Dates by Time Zone

Script 13.4

This HTML for the time zone script uses classes to tag the different offices with the time zone for that office.

Script 13.5

This JavaScript displays specified time zones, but you can adapt it to display any time zone you wish.

window.onload = initDate;

function initDate() {
	var allTags = document.getElementsByTagName("*");
	
	for (var i=0;i<allTags.length; i++) {
		if (allTags[i].className.indexOf("tz")==0) {
			showTheTime(allTags[i],allTags[i].className.substring(2));
		}
	}
}

function showTheTime(currElem,tzOffset) {
	var dayName = new Array ("Sunday","Monday","Tuesday","Wednesday","Thursday","Friday","Saturday");

var thatTZ = new Date();
	var dateStr = thatTZ.toUTCString();

dateStr = dateStr.substr(0,dateStr.length - 3);
	thatTZ.setTime(Date.parse(dateStr));
	thatTZ.setHours(thatTZ.getHours() + parseInt(tzOffset));
	
	currElem.innerHTML = showTheHours(thatTZ.getHours()) + showZeroFilled(thatTZ.getMinutes()) + showAmPm(thatTZ.getHours()) + dayName[thatTZ.getDay()];

function showTheHours(theHour) {
		if (theHour == 0) {
			return (12);
		}
		if (theHour < 13) {
			return (theHour);
		}
		return (theHour-12);
	}
	
	function showZeroFilled(inValue) {
		if (inValue > 9) {
			return ":" + inValue;
		}
		return ":0" + inValue;
	}
	
	function showAmPm(thatTime) {
		if (thatTime < 12) {
			return (" AM ");
		}
		return (" PM ");
	}
}