Multiple Image Links 2b


<script type="text/javascript">
<!--

var images = [
["1.gif","2.gif","3.gif","4.gif"],
["5.gif","6.gif","7.gif","8.gif"],
["9.gif","10.gif","11.gif","12.gif"],
["13.gif","14.gif","15.gif","16.gif"]
]

function mOver(id,num){
n=id.substring(id.length-1,id.length)

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

document.getElementById(id).style.width="50px"
document.getElementById(id).style.height="50px"
}

function doEvents(){
this.status="out"

this.over=function(id,num){

if(this.status!="up"){
document.getElementById(id).src=images[num][1]
this.status="over"
}

}

this.mOut=function(id,num){

if(this.status!="up"){
document.getElementById(id).src=images[num][0]
this.status="out"
}

}

this.mDown=function(id,num){

if(this.status!="up"){
document.getElementById(id).src=images[num][2]
this.status="down"
}

}

this.mUp=function(id,num){

if(this.status=="up"){
document.getElementById(id).src=images[num][0]
this.status="out"
}
else{
document.getElementById(id).src=images[num][3]
this.status="up"
}

}

}

// -->
</script>

<h1>Multiple Image Links 2b</h1>
With each link use a seperate image for onmouseover, onmouseout, onmousedown, and onmouseup.<br>
Once onmouseuped, onmouseover, onmouseout, and onmousedown for that image are cancelled until the page is refreshed
<P>