deep12
06-30-2004, 10:47 PM
My code for show and hide layer is as below.My prob is that it is not working in NN4. why so ? What is the solution for it ?
<HTML>
<HEAD>
<style type="text/css">
<!--
.demo {color:#000033; background-color:#cccccc; layer-background-color:#cccccc;
position:absolute; top:100px; left:100px; width:480px; height:280px;
z-index:99; visibility:hidden;}
-->
</style>
<script type="text/javascript">
<!--
function toggleBox(szDivID, iState) // 1 visible, 0 hidden
{
if(document.layers) //NN4+
{
document.layers[szDivID].visibility = iState ? "show" : "hide";
}
else if(document.getElementById) //gecko(NN6) + IE 5+
{
var obj = document.getElementById(szDivID);
obj.style.visibility = iState ? "visible" : "hidden";
}
else if(document.all) // IE 4
{
document.all[szDivID].style.visibility = iState ? "visible" : "hidden";
}
}
// -->
</script>
</HEAD>
<BODY>
<div ID="demodiv" class="demo">
Put text, tables or any other HTML contents here, as you would put in
any other HTML page.
.....
..... and more.
</div>
<!-- To Show The DIV -->
hii
<input type="button" onClick="toggleBox('demodiv',1);" value="Show Div">
<!-- To Hide The DIV -->
<input type="button" onClick="toggleBox('demodiv',0);" value="Hide Div">
</BODY>
</HTML>
<HTML>
<HEAD>
<style type="text/css">
<!--
.demo {color:#000033; background-color:#cccccc; layer-background-color:#cccccc;
position:absolute; top:100px; left:100px; width:480px; height:280px;
z-index:99; visibility:hidden;}
-->
</style>
<script type="text/javascript">
<!--
function toggleBox(szDivID, iState) // 1 visible, 0 hidden
{
if(document.layers) //NN4+
{
document.layers[szDivID].visibility = iState ? "show" : "hide";
}
else if(document.getElementById) //gecko(NN6) + IE 5+
{
var obj = document.getElementById(szDivID);
obj.style.visibility = iState ? "visible" : "hidden";
}
else if(document.all) // IE 4
{
document.all[szDivID].style.visibility = iState ? "visible" : "hidden";
}
}
// -->
</script>
</HEAD>
<BODY>
<div ID="demodiv" class="demo">
Put text, tables or any other HTML contents here, as you would put in
any other HTML page.
.....
..... and more.
</div>
<!-- To Show The DIV -->
hii
<input type="button" onClick="toggleBox('demodiv',1);" value="Show Div">
<!-- To Hide The DIV -->
<input type="button" onClick="toggleBox('demodiv',0);" value="Hide Div">
</BODY>
</HTML>