float div

Question

Hi I have a simple question (not for me)

how can I confirm only one div open. I want when users click to open the secent div, the first div will be closed.

my code:

<style type="text/css">

<!--

.demo {color:#000033; background-color:#cccccc; layer-background-color:#cccccc;

position:absolute; top:300px; left:300px; width:480px; height:280px;

z-index:99; visibility:hidden;}

-->

</style>

<script type="text/javascript">

<!--

function toggleBox(DivID, iState) // 1 visible, 0 hidden

{

if(document.getElementById) //gecko(NN6) + IE 5+

{

var obj = document.getElementById(DivID);

obj.style.visibility = iState ? "visible" : "hidden";

}

}

<div>

<div ID="demodiv" class="demo"> text, tables or any other HTML contents here.<input type="button" onClick="toggleBox('demodiv',0);" value="Hide Div">

</div>

<div ID="demodiv2" class="demo">text2, tables or any other HTML contents here.<input type="button" onClick="toggleBox('demodiv2',0);" value="Hide Div">

</div>

<input type="button" onClick="toggleBox('demodiv',1);" value="Show Div">

<br /><br />

<input type="button" onClick="toggleBox('demodiv2',1);" value="Show Div">

</div>

 

Thanks mali