Zelaron Gaming Forum - View Single Post

Lenny · Posted 2006-06-27, 10:30 PM in reply to Lenny's post "Collapse section"

Code:

<xhtml>
<head>
<title>Collapse test</title>
<script type="text/javascript">
function ToggleCollapse(sectionid,iconid){
  var theSection=document.getElementById(sectionid);
  var theIcon=document.getElementById(iconid);
  if(theSection.style.display=="block"){
    theSection.style.display="none";
    theIcon.src="opensection.gif";
  }else{
    theSection.style.display="block";
    theIcon.src="closesection.gif";
  }
}
</script>
</head>
<body style="color:black;background-color:white;">
<table style="background-color:black;" cellspacing="1">
<tr><th style="background-color:gray;"><a href="#" style="float:right;" onclick="ToggleCollapse('section1','icon1');return false;"><img src="opensection.gif" border="0" id="icon1" /></a>A title goes here</th></tr>
<tbody id="section1" style="display:none;">
<tr><td style="background-color:gray;">This can be hidden</td></tr>
<tr><td style="background-color:gray;">And span several rows</td></tr>
</tbody>
</table>
</body>
</xhtml>

You'll need to supply your own opensection.gif and closesection.gif.