I want to hide DIV place holder

[Darren]

This works fine in netscape but IE won't do it. I have a div which contains
some links and a thumbnail. What's supposed to happen is when you click the
thumbnail the links disapear and the now invisible div is resized moving
everything below it. In IE it only resizes as small as the size of the dive
plus the size of the links.

heres an example

<div class="relatedLinks" id="posix">
<h3>Posix (Linux,UNIX,BSD)</h3>
<img id ="posixDropdownButton" src="downarrow.gif" width="8" height="8"
onClick="showHideDropDown('posixSection','posixDro pdownButton','posixSection
','8px','112px')">
<div id="posixSection">
<a href="http://www.freshmeat.net" target="_top">Freshmeat</a>
<a href="http://www.redhat.com/" target="_top">RedHat Linux</a>
<a href="http://www.debian.org/" target="_top">Debian Linux</a>
<a href="http://www.novell.com/linux/suse/" target="_top">Suse
Linux</a>
<a href="http://www.slackware.com/" target="_top">Slackware
Linux</a>
<a href="http://www.freebsd.org/" target="_top">FreeBSD</a>
<a href="http://www.openbsd.org/" target="_top">OpenBSD</a>
</div>
</div>

the function for doiong the magic is

function showHideDropDown(tItem,tIcon,tParent,tMin,tMax)
{
var lItem=document.getElementById(tItem);
var lIcon=document.getElementById(tIcon);
var parentSection=document.getElementById(tParent);
if (lIcon.src.search("uparrow.gif")!=-1)
{
lIcon.src="downarrow.gif";
lItem.style.visibility="hidden";
parentSection.style.height=tMin;

}
else
{
lIcon.src="uparrow.gif";
lItem.style.visibility="visible";
parentSection.style.height=tMax;
}

}

It works terrific in netscape but it looks tacky in IE. Any ideas how to
make it work properly?

Thanks

[Martin Kurz]

Hi Darren,

function showHideDropDown(tItem,tIcon,tParent,tMin,tMax)
{
var lItem=document.getElementById(tItem);
var lIcon=document.getElementById(tIcon);
var parentSection=document.getElementById(tParent);
if (lIcon.src.search("uparrow.gif")!=-1)
{
lIcon.src="downarrow.gif";
lItem.style.visibility="hidden";
parentSection.style.height=tMin;

}
else
{
lIcon.src="uparrow.gif";
lItem.style.visibility="visible";
parentSection.style.height=tMax;
}

}

It works terrific in netscape but it looks tacky in IE. Any ideas how to
make it work properly?

Instead of setting CSS-Visibilty to visible/hidden set Display to block/none:

if (lIcon.src.search("uparrow.gif")!=-1)
{
lIcon.src="downarrow.gif";
lItem.style.display="none";
parentSection.style.height=tMin;

}
else
{
lIcon.src="uparrow.gif";
lItem.style.display="block";
parentSection.style.height=tMax;
}

Greetings,

Martin

[Darren]

"Martin Kurz" <in**@martinkurz.in-berlin.de> wrote in message
news:11***************@elch.in-berlin.de...

Hi Darren,

Spot on Marten. That did the trick. Thanks so much.