// array of "hover state" images
var hoverImages  = new Array() ;

// array of "normal state" images
var normalImages = new Array() ;

// this function is called on page load
function preloadImages() {
	var hoverImagesName = new Array(
				'fileadmin/template/top_hq_active.jpg',
				'fileadmin/template/top_ts_active.jpg',
				'fileadmin/template/top_nd_active.jpg',
				'fileadmin/template/top_ct_active.jpg') ;

	var normalImagesName = new Array(
				'fileadmin/template/top_hq.jpg',
				'fileadmin/template/top_ts.jpg',
				'fileadmin/template/top_nd.jpg',
				'fileadmin/template/top_ct.jpg') ;

	for (var i = 0 ; i < hoverImagesName.length ; i++) {
		hoverImages[i]  = new Image() ;
		normalImages[i] = new Image() ;

		hoverImages[i].src  = hoverImagesName[i] ;
		normalImages[i].src = normalImagesName[i] ;
	}
}

// this function resets all images to their "normal" state
// used when clicking on an image, to reset all images
function resetAll() {
	for (var i = 1 ; i <= hoverImages.length ; i++) {
		document.getElementById("menu"+i).src = normalImages[i-1].src ;
		document.getElementById("menu"+i).style.width = 150 ;
		document.getElementById("menu"+i).style.height = 24 ;
	}	
}

// used on mouseover
function setHover(num) {
	document.getElementById("menu"+num).src = hoverImages[num-1].src ;
	document.getElementById("menu"+num).style.width = 150 ;
	document.getElementById("menu"+num).style.height = 29 ;
}

// used on mouseout
function setNormal(num) {
	document.getElementById("menu"+num).src = normalImages[num-1].src ;
	document.getElementById("menu"+num).style.width = 150 ;
	document.getElementById("menu"+num).style.height = 24 ;
}

window.onload = preloadImages ;