DOM DHTML Collapser

[Total: 0    Average: 0/5]

This example will collapse text so the HTML code will resize around the hidden objects.

Body Code:

This works for both IE6 and NS6.
The height must be at least 1 pixel for this to work.
<script>
var _height=null;
function sh(_d)
{
  var _x = document.getElementById(_d);
  if(_height==null)_height=_x.style.height;
  _x.style.visibility=_x.style.visibility=="hidden"?"visible":"hidden";
  _x.style.overflow=_x.style.overflow=="hidden"?"visible":"hidden";
  _x.style.height=_x.style.height=="1px"?"1em":"1px";
}
</script>
<div class=h id=d1>one</div>
<div class=h id=d2>two</div>
<div class=h id=d3>three</div>
<HR>
<BR>
Show/Hide: <a href="javascript:sh('d1');">ONE</a> |
<a href="javascript:sh('d2');">TWO</a> |
<a href="javascript:sh('d3');">THREE</a>

Times Viewed: 1

Leave a Reply

Your email address will not be published. Required fields are marked *