<script type=”text/javascript”><!–
function OpenDiv(id) {
var opened_divs = 0;
for (i=1;i<=5;i++) { // so you can add more than 2
var divname = ‘div’+i;
var divstyle = document.getElementById(divname).style;
if(divstyle.display == ‘block’) opened_divs++;
}
var state = document.getElementById(id).style;
if(state.display == ‘block’) {
state.display = ‘none’;
return;
}
else if (state.display == ‘none’){
if(opened_divs < 3) {
state.display = ‘block’;
return;
}
else {
for (j=3;j<=5;j++) {
var new_div = ‘div’+j;
if(document.getElementById(new_div).style.display == ‘block’ && new_div != id) {
document.getElementById(new_div).style.display = ‘none’
document.getElementById(id).style.display = ‘block’
return;
}
}
}
}
}
// –></script>
<div id=”alldivs”><!– all will probably confuse IE = see document.all –>
<a class=”gray” onclick=”OpenDiv(‘div1′);”>DIV 1</a>
<div id=”div1″ style=”display: block;”>Div 1</div>
<a class=”gray” onclick=”OpenDiv(‘div2′);”>DIV 2</a>
<div id=”div2″ style=”display: block;”>Div 2</div>
<a class=”gray” onclick=”OpenDiv(‘div3′);”>DIV 3</a>
<div id=”div3″ style=”display: block;”>Div 3</div>
<a class=”gray” onclick=”OpenDiv(‘div4′);”>DIV 4</a>
<div id=”div4″ style=”display: none;”>Div 4</div>
<a class=”gray” onclick=”OpenDiv(‘div5′);”>DIV 5</a>
<div id=”div5″ style=”display: none;”>Div 5</div>
</div>