How to hide DIV under another DIV

[sconti11]

I have a page where I am attempting to show and hide a div tag.

Here is the code I am using:

<style>
<!--

.topTable {position:absolute; z-index:20;}

.hideshow {color: darkblue; font-weight: normal; font-size: 9pt; text-decoration: none; font-family: Arial}
.hideshow :hover {color: darkred; font-weight: normal; font-size: 9pt; text-decoration: none; font-family: Arial}


-->
</style>

<script language="JavaScript">
<!--
function showLayer() {
hiddenLayer = document.getElementById("TableLayer");
layerPosition = parseInt(hiddenLayer.style.top);
if (layerPosition < 0) {
hiddenLayer.style.top = (layerPosition + 5) + "px";
setTimeout("showLayer()", 5);
}
}
function hideLayer() {
hiddenLayer = document.getElementById("TableLayer");
hiddenLayer.style.top = "-300" + "px";

}
//-->
</script>
</head>

...then I have one DIV tag that is using the class 'topTable' and another DIV tag that has the following property:

<div id="TableLayer"
style="position:absolute; top:-300; margin-top:10; z-index:10;">
<p> something</p>
</div>

...the negative top position was intended to hide the 2nd div under the first...but I need the starting position to be at the bottom of the 1st div not from the top of the page..

Hopefully this makes sense????

 

[dmsd40]

If I'm understanding correctly, I think you actually need both divs to have the *same* absolute positioning, then adjust which shows up with the z-index.

Windows Cloud Servers:

http://www.resellerchoice.com/Cloud_Hosting/Benefits_of_Cloud_Hosting.aspx

Windows Reseller Hosting:

http://www.resellerchoice.com

 

[Mugiwara]

Why don't you just hide the container rather than changing its z-index. and use the javascript to show the element you want

getElementById("name").style.display = "none";    // hides the element
getElementById("name").style.display = "block" // shows the element;