/*
Just add this element set to your page and put your revealer content in the middle div and voila

<div  class="trHiderControl">
<span onclick="trReveal(this);"  trhidertoggle="false" trID="trRevealer" class="trHiderTopClick">reveal</span> 
<div class="trHiderContent" trID="trHiderContent">

<!--content here-->
blah blah
<!--content here-->

</div>
<span class="trHiderBottomClick" trID="trReHider" onclick="trHider(this);">close up</span>
</div>


*/
//hold original text
var sReveal = "reveal";
var sHider = "close up";
//reveal text inline.
function trReveal(oEl)
{
	if(oEl.getAttribute("trhidertoggle")=="true")
	{
		trHider(oEl);
		return;
	}
	
	oTopEl = oEl.parentNode;
	
	
	for(i=0; i<oTopEl.childNodes.length; i++)
	{
	
		if(1==oTopEl.childNodes[i].nodeType)
		{
			switch(oTopEl.childNodes[i].getAttribute("trID"))
			{
				case "trRevealer":
					oTopEl.childNodes[i].setAttribute("trhidertoggle","true");
	
					break;
				case "trHiderContent":
					oTopEl.childNodes[i].style.display = "block";
					break;
				case "trReHider":
					oTopEl.childNodes[i].style.display = "block";
					break
				default:
					//nothing
			}

		}
	}
	
	
}

//reveal text inline
function trHider(oEl)
{
	
	oTopEl = oEl.parentNode;	

	
	for(i=0; i<oTopEl.childNodes.length; i++)
	{
	
		if(1==oTopEl.childNodes[i].nodeType)
		{
			switch(oTopEl.childNodes[i].getAttribute("trID"))
			{
				case "trRevealer":
					oTopEl.childNodes[i].setAttribute("trhidertoggle","false");
	
					break;
				case "trHiderContent":
					oTopEl.childNodes[i].style.display = "none";
					break;
				case "trReHider":
					oTopEl.childNodes[i].style.display = "none";
					break
				default:
					//nothing
			}

		}
	}

}


