function show( oSourceElement ) {
// this function uses list of 'associated elements' to display a target and align it to the lower left corner of it's source
// question: what is browser compatability of offsetLeft and offsetHeight properties?

 associatedElements[oSourceElement.id].style.top = oSourceElement.offsetTop+oSourceElement.offsetHeight;
 associatedElements[oSourceElement.id].style.left = oSourceElement.offsetLeft;
 associatedElements[oSourceElement.id].style.display = "block";

}

//this function uses list of 'associated elements' to disable display of all targets
function hideAll ( ) { for (i in associatedElements) associatedElements[i].style.display = "none"; }

function initMenu () {
// this function creates our list of 'assocated elements' - a set of elements, source triggers target
// this function uses our list to set event handlers

associatedElements = new Array();

associatedElements['trigAdvantage'] = document.getElementById('targAdvantage');
associatedElements['trigServices'] = document.getElementById('targServices');
associatedElements['trigMetallurgical'] = document.getElementById('targMetallurgical');
associatedElements['trigGettingStarted'] = document.getElementById('targGettingStarted');
//REMOVE THESE TWO LINES WHEN LAUUNCHING THE NEW FEEDBACK FORM LINK
//associatedElements['trigContact'] = document.getElementById('targContact');

for (i in associatedElements) {

	document.getElementById(i).onmouseover = function () { hideAll(); show(this); };
	associatedElements[i].onmouseout = function (e) { 
		//this little bit below checks to see if the element the mouse moves IN to (from our element) is a
		//descendent of our element. This is necessary to prevent premature 'hiding' of the element
		if (!e) var e = window.event;
		o1 = (e.relatedTarget) ? e.relatedTarget : e.toElement;			
		while (o1 != this && o1.nodeName != 'HTML') o1 = o1.parentNode; 
		if (o1 != this) hideAll();
	 };


}

}

window.onload = initMenu;