"F. Da Costa" <da*****@xs4all.nl> wrote in message
news:3f*********************@news.xs4all.nl...
What I'm trying to do here is simultaneously hide 1 or more rows
Any suggestions appreciated.
You may not need div's at all. The tr and table elements support the
visibility property, so you could just use that.
Ex: This doesn't hide the table, but it could. It will show/hide row1 and
row2 on demand. If you don't like the scruch-up/expand effect, take out the
..position stuff. This has the added bonus of doin gaway with the
'getElementById' method, which, while a very very very handy method, I
believe it has some compatibility issues with the little guys. Anyway here
goes:
<html><head>
<script language=javascript>
function hideOrShow(obj)
{
if (obj.style.visibility == 'visible') {
hide(obj);
}
else {
show(obj);
}
}
function show(obj)
{
obj.style.visibility = 'visible';
obj.style.position = 'relative';
}
function hide(obj)
{
obj.style.visibility = 'hidden';
obj.style.position = 'absolute';
}
</script></head>
<body>
<table border=1>
<tr id=tr1 style="visibility:visible; position:relative;">
<td>Hi I live in tr1</td>
</tr>
<tr id=tr2 style="visibility:visible; position:relative;">
<td>Hi I live in tr2</td>
</tr>
</table>
<input type=button onclick="hideOrShow(tr1)" value="Hide/Show row1">
<input type=button onclick="hideOrShow(tr2)" value="Hide/Show row2">
</body></html>