var navigation = {};
function navLink( DOMelement, MapElement, imgSrc, hoverImgSrc ) {
	this.DOMelement = DOMelement;
	this.imgSrc = imgSrc;
	this.hoverImgSrc = hoverImgSrc;
	var that = this;
	MapElement.onmouseover = function() {that.hover();};
	MapElement.onmouseout = function() {that.unHover();};
	MapElement.onclick = function() {that.unHover();};
}

navLink.prototype.hover = function() {
	this.DOMelement.src = this.hoverImgSrc;
};

navLink.prototype.unHover = function() {
	this.DOMelement.src = this.imgSrc;
};

window.onload = function(e) {
	var navArea = document.getElementById("navigationArea");
	var navImgs = [];
	var i = 0;
	var currNode;
	for( i = 0; i < navArea.childNodes.length; i++ ) {
		currNode = navArea.childNodes[i];
		if (currNode.tagName && currNode.tagName == "IMG") {
			navImgs[navImgs.length] = navArea.childNodes[i];
		}
	}
	
	navigation.home = new navLink( navImgs[0], document.getElementById("navHomeId"), "http://www.youthexpress.net/images/tabs/home.png", "http://www.youthexpress.net/images/tabs/home_hov.png");
	navigation.whoweare = new navLink( navImgs[1], document.getElementById("navAboutId"), "http://www.youthexpress.net/images/tabs/about.png", "http://www.youthexpress.net/images/tabs/about_hov.png");
	navigation.whatwedo = new navLink( navImgs[2], document.getElementById("navProgramsId"), "http://www.youthexpress.net/images/tabs/programs.png", "http://www.youthexpress.net/images/tabs/programs_hov.png");
	navigation.getinvolved = new navLink( navImgs[3], document.getElementById("navContactId"), "http://www.youthexpress.net/images/tabs/contact.png", "http://www.youthexpress.net/images/tabs/contact_hov.png");
	navigation.press = new navLink(navImgs[4], document.getElementById("navPressId"), "http://www.youthexpress.net/images/tabs/press.png", "http://www.youthexpress.net/images/tabs/press_hov.png");
};