PartMental
September 11th, 2002, 07:33 PM
I have a problem getting an Expanding/Collapsing Implementation to work with Netscape.
This is what I have now:
Several pages contain forms with a lot of data to enter. The forms are divided into fieldsets. Each fieldset has a heading with a plus sign (image) beside it. When you click the plus sign the fieldset expands, showing it's contents, and everything below it moves down, and the plus sign changes to a minus. When you click the minus sign, the fieldset collapses (hides) and everything below it moves up.
This is how I've done it:
<script language="javascript" type="text/javascript">
function ChangeCollapsing(Switch,SectionName)
{
Section=document.getElementById(SectionName);
if (Section.style.display=="none")
{
Section.style.display="";
Switch.src="minus.gif";
Switch.title="Collapse section";
}
else
{
Section.style.display="none";
Switch.src="plus.gif";
Switch.title="Expand section";
}
}
</script>
<div>
<img title="Expand section" src="plus.gif" onClick="ChangeCollapsing(this,'SectionOne');"> Section One
</div>
<div id="SectionOne" style="display:none;">
...
</div>
<div>
<img title="Expand section" src="plus.gif" onClick="ChangeCollapsing(this,'SectionTwo');"> Section Two
</div>
<div id="SectionTwo" style="display:none;">
...
</div>
How do I make it work with NS?
I know I have to get rid of the onClick and use href="javascript:ChangeCollapsing()" and add LAYERs.
The real problem here is because I rely on getElementById and style.display. What is the NS equivalent?
Thanks for any help you can give me. Have a great day.
This is what I have now:
Several pages contain forms with a lot of data to enter. The forms are divided into fieldsets. Each fieldset has a heading with a plus sign (image) beside it. When you click the plus sign the fieldset expands, showing it's contents, and everything below it moves down, and the plus sign changes to a minus. When you click the minus sign, the fieldset collapses (hides) and everything below it moves up.
This is how I've done it:
<script language="javascript" type="text/javascript">
function ChangeCollapsing(Switch,SectionName)
{
Section=document.getElementById(SectionName);
if (Section.style.display=="none")
{
Section.style.display="";
Switch.src="minus.gif";
Switch.title="Collapse section";
}
else
{
Section.style.display="none";
Switch.src="plus.gif";
Switch.title="Expand section";
}
}
</script>
<div>
<img title="Expand section" src="plus.gif" onClick="ChangeCollapsing(this,'SectionOne');"> Section One
</div>
<div id="SectionOne" style="display:none;">
...
</div>
<div>
<img title="Expand section" src="plus.gif" onClick="ChangeCollapsing(this,'SectionTwo');"> Section Two
</div>
<div id="SectionTwo" style="display:none;">
...
</div>
How do I make it work with NS?
I know I have to get rid of the onClick and use href="javascript:ChangeCollapsing()" and add LAYERs.
The real problem here is because I rely on getElementById and style.display. What is the NS equivalent?
Thanks for any help you can give me. Have a great day.