Forum Moderators: open
<html>
<head>
<script language="JavaScript1.2">
function hideshow(which){
if (!document.getElementById)
return
if (which.style.display=="none")
which.style.display=""
else
which.style.display="none"
}
</script>
<title>show hide</title>
</head>
<body bgcolor="#D4D0C8">
<table cellpadding="0" cellspacing="0" width="40%" bgcolor="#FFFFFF">
<tr>
<td>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<th align="left">Lorem</th>
<th align="right" width="40">
<a href="javascript:hideshow(document.getElementById('newsDiv'))">hide/show</a>
</th>
</tr>
</table>
<div id="newsDiv" style="font:24px bold;">
<table id="newsContent" NOWRAP align="center" width=100% cellspacing="0">
<tr>
<td class="padding7-5-7-7">
<table border="0" cellpadding="2" cellspacing="2" width="100%">
<tr>
<td align="right" width=100%><a href="javascript:void(0)" onClick="openWind('0');">Ipsum</a></td>
</tr>
</table>
<table border="0" cellpadding="0" cellspacing="0" width="100%">
<tr>
<td align="left"><span class="newsDate">Dolor</span></td>
</tr>
<tr>
<td align="left" class="lineUnder"> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. <br> </td>
</tr>
</table>
</td>
</tr>
</table></div>
</td>
</tr>
</table>
<p> Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum. </p>
</body>
</html>
1. Can only reference those with "position: absolute";
- "relative" at [0,0] may do.
- only inline style too (I think)
2. To reference a positioned div, nested in a positioned div is more complicated. Not covered here.
3. I believe NS4 doesn't render dynamic changes in display.
So, due to #3, I'll go with visibility instead.
Plug-in
First we need a referencing plug-in to teach NS4 and IE4 to understand. This is the best way, since it only needs to be done once in a single, but quite long, statement.
This plug-in is not a full getElementById emulation, because:
- nested layers in NS4 (above)
- will return named elements in IE4, and collections if there are >1.
So don't use an id more than once.
togVisibility
NS4 elements don't have a style object. The style property is accessed directly off the element. A quick test for the existence of the element's style object, with the default returning the element itself..
var style = elm.style¦¦elm;
Then we have to take into account the fact that NS4 has it's own version of the visibility properties ["show","hide"]. Only need worry about "hide", because the you have set it up sensibly so we don't explicitly say "visible¦show".
//---- referencing plug-in --------------------------------------document.getElementById =
document.getElementById ¦¦
document.all ¦¦
function(id){return this.layers[id]};
//---------------------------------------------------------------function togVisibility(elm)
{
var style = elm.style¦¦elm;
var hidden = {hidden:1,hide:1}[style.visibility];
if(hidden)
style.visibility = "";
else
style.visibility = document.layers? "hide":"hidden";
}
I don't have NS4 here to test this version. It may need a tweak.
Definitely swap the ¦ symbol in the code for a real pipe.
