function ShowFlyOut(RootElement, FlyOutElement, Direction){
	/*
	This function can be used to reveal any HTML element in relation to another.
	
	Required Parameters:
		RootElement: 	ID of the HTML element upon which the FlyOutElement is rooted.
		FlyOutElemnet:	ID of the HTML element you want to show.
		Direction:		Up|Down|Left|Right - The direction in reference to the 
						RootElement in which the FlyOutElement should be shown.
	
	Optional Parameters:
		arAttributes:	Additional parameters can be passed in and will be stored in 
			arAttributes. These can be used to effect the presentation of the revealed 
			element. Specifically you can directly manipulate the offsetLeft, offsetRight,
			width, and height of the FlyOutElement. These do not have to be set via the
			call the this function. Default offsetLeft is the left of the RootElement. 
			Default offsetTop is the bottom of the RootElement. Default width and height 
			is best set through CSS.
	*/
	var oRootElement = document.getElementById(RootElement);
	var oFlyOutElement = document.getElementById(FlyOutElement);
	var posLeft = GetCoordinateLeft(oRootElement)
	var posTop = GetCoordinateTop(oRootElement)
	switch(Direction){
		case "Bottom": posTop += oRootElement.offsetHeight; break;
		case "Right": posLeft += oRootElement.offsetWidth; break;
		//case "Top": posTop -= oRootElement.offsetHeight; break;
		//case "Left":
		default: posTop += oRootElement.offsetHeight; break; //identical to Bottom
	}
	arAttributes = new Array("","","",""); //arAttributes: offsetLeft, offsetTop, width, height
	for (var i=3; i<arguments.length; i++) {
		arAttributes[i-3] = arguments[i]
	}
	if (arAttributes[0].length!=0) posLeft = posLeft + arAttributes[0];
	if (arAttributes[1].length!=0) posTop = posTop + arAttributes[1];
	else posTop += -1;
	if (arAttributes[2].length!=0) oFlyOutElement.style.width = arAttributes[2];
	if (arAttributes[3].length!=0) oFlyOutElement.style.height = arAttributes[3];
	oFlyOutElement.style.left = posLeft +"px";
	oFlyOutElement.style.top = posTop +"px";
	oFlyOutElement.style.visibility = "visible";
	oFlyOutElement.style.display = "block";
	oFlyOutElement.style.zIndex = oRootElement.style.zIndex + 100;
}
function HideFlyOut(FlyOutElement){
	// This function can be used to hide any HTML element. FlyOutElemnet: ID of the HTML element you want to hide.
	var oFlyOutElement = document.getElementById(FlyOutElement);
	//oFlyOutElement.style.display = "none"; Keep this commented out. For some reason it causes some wierdness in Mozilla 1.3.
	oFlyOutElement.style.visibility = "hidden";
	oFlyOutElement.style.zIndex = -1;
}
function GetCoordinateLeft(eElement){
	//Returns the left coordinate of any HTML element
	var nLeftPos = eElement.offsetLeft;
	var eParElement = eElement.offsetParent;
	while (eParElement != null){
		nLeftPos += eParElement.offsetLeft;
		eParElement = eParElement.offsetParent;
	}
	return nLeftPos;
}
function GetCoordinateTop(eElement){
    //Returns the top coordinate of any HTML element
	var nTopPos = eElement.offsetTop;            
    var eParElement = eElement.offsetParent;     
    while (eParElement != null){
        nTopPos += eParElement.offsetTop;
        eParElement = eParElement.offsetParent;
    }
    return nTopPos;
}
