Expand & Collapse 2

If not clicked:
Onmouseover = show
Onmouseout = hide

Onclick show current, hide previous, if same is clicked hide current

Link 1
Element One

Link 2
Element Two

Link 3
Element Three

<HTML>
<HEAD>
<TITLE>Expand & Collapse 2</TITLE>

<script type="text/javascript">

lastId=""
lastLink=""
lastObj=""

function mOver(n,id){
if(!window["obj"+n]){
window["obj"+n]=new doEvents()
}
window["obj"+n].over(id)
}

function doEvents(){

this.over=function(id){
num=id.substring(id.length-1,id.length)

if(this.status!="clicked"){
document.getElementById(id).style.display="block"
document.getElementById("lnk"+num).style.fontWeight="bold"
this.status="over"
}

}

this.mOut=function(id){

if(this.status!="clicked"){
document.getElementById(id).style.display="none"
document.getElementById("lnk"+num).style.fontWeight="normal"
this.status="out"
}

}

this.mClick=function(id){
//if(id==lastId){return}

if(id==lastId&&this.status=="over"||this.status=="out"){
document.getElementById(id).style.display="block"
document.getElementById("lnk"+num).style.fontWeight="bold"
this.status="clicked"
}
else{

if(this.status!="clicked"){
document.getElementById(id).style.display="block"
document.getElementById("lnk"+num).style.fontWeight="bold"
this.status="clicked"
}

if(lastObj!=""&&window[lastObj].status=="clicked"){
document.getElementById(lastId).style.display="none"
document.getElementById(lastLnk).style.fontWeight="normal"
window[lastObj].status="out"
}

}

lastId=id
lastLnk="lnk"+num
lastObj="obj"+num
}


}

</script>

<style type="text/css">
.lnks{
width:50px;
cursor:hand;
cursor:pointer;
}
</style>

</HEAD>
<BODY>
<h1>Expand & Collapse 2</h1>
 
<div id="lnk1" class="lnks" onmouseover="mOver(1,'div1')" onmouseout="obj1.mOut('div1')" onclick="obj1.mClick('div1')">Link 1</div>
<div id="div1" style="display:none;width:100px">
Element One
</div>
<div id="lnk2" class="lnks" onmouseover="mOver(2,'div2')" onmouseout="obj2.mOut('div2')" onclick="obj2.mClick('div2')">Link 2</div>
<div id="div2" style="display:none;width:100px">
Element Two
</div>
<div id="lnk3" class="lnks" onmouseover="mOver(3,'div3')" onmouseout="obj3.mOut('div3')" onclick="obj3.mClick('div3')">Link 3</div>
<div id="div3" style="display:none;width:100px">
Element Three
</div>

</BODY>
</HTML>