/*

Usage:

place this in your HEAD tags:

	<script language="JavaScript" src="buttonupdwn.js"></script>

Place this in your HTML

	<img src="BtnUp2.gif" name="imgfirst" width="15" height="15" border="0" >
	<a  href="#first" onmouseover="shoh('first');" onmouseout="shoh('first');">Customer Support</a>

	<div style="display: none;" id="first" >
			
			With its friendly solutions-oriented 
				      
	
	</div>


WHEREINPATH is where you are storing this script on your account
IMAGESDIR is where on your acoount you are storing the icons for (expanded collapsed)

*/

imgout=new Image(15,15);
imgin=new Image(15,15);

/////////////////BEGIN USER EDITABLE///////////////////////////////
	imgout.src="BtnUp2.gif";
	imgin.src="BtnDown2.gif";
///////////////END USER EDITABLE///////////////////////////////////

//this switches expand collapse icons
function filter(imagename,objectsrc){
	if (document.images){
		document.images[imagename].src=eval(objectsrc+".src");
	}
}

//show OR hide funtion depends on if element is shown or hidden
function shoh(id) { 
	
	if (document.getElementById) { // DOM3 = IE5, NS6
		if (document.getElementById(id).style.display == "none"){
			document.getElementById(id).style.display = 'block';
			filter(("img"+id),'imgin');			
		} else {
			filter(("img"+id),'imgout');
			document.getElementById(id).style.display = 'none';			
		}	
	} else { 
		if (document.layers) {	
			if (document.id.display == "none"){
				document.id.display = 'block';
				filter(("img"+id),'imgin');
			} else {
				filter(("img"+id),'imgout');	
				document.id.display = 'none';
			}
		} else {
			if (document.all.id.style.visibility == "none"){
				document.all.id.style.display = 'block';
			} else {
				filter(("img"+id),'imgout');
				document.all.id.style.display = 'none';
			}
		}
	}
}