Toggle Visibility und co
in fact, it’s toggle display here. The difference is that visibility reserves the space on the page but just does not display the text there and display really collapses the text to the remaining parts.
JavaScript Function:
<script language="JavaScript">
function toggle(element)
{
// alert (document.getElementById(element).style.display);
var neuer_status;
if(document.getElementById(element).style.display == 'block')
neuer_status = 'none'
else
neuer_status = 'block'
document.getElementById(element).style.display = neuer_status;
}
</script>
HTML Source Code
(in a loop with $i)
<a href=# onMouseOver=javaScript:toggle(\"mem".$i."\");
onMouseOut=javaScript:toggle(\"mem".$i."\");>".Toggle!."</a>
<div class=\"hiddenbox\" id=\"mem".$i."\">".Some hidden Text."</div>
CSS Definition
.hiddenbox {
position:absolute;
display:inline;
display:none;
width:200px;
}
Move a block to another position
how to move a div box with JavaScript (das kann man natuerlich noch beliebig verfeinern, see also: http://www.html-world.de/program/dhtml_3.php.):
onClick = "document.getElementById(element).style.top=600+'px';"