PDA

View Full Version : Change onMouseover Event Question



theflyingminstrel
07-17-2009, 06:44 PM
Hi I'm using the script below in conjunction with this pop-over script (http://www.dynamicdrive.com/dynamicindex1/popit.htm).

I wanted to know if it's possible to change the onMouseover array number every time a different image is chosen.

<img alt="" onMouseover="showmenu(event,linkset[0], '115px')" onMouseout="delayhidemenu()" name="imgColor" src="images/flower-yellow.jpg" />

Ex: onMouseover="showmenu(event,linkset[0], '115px')" --> onMouseover="showmenu(event,linkset[1], '115px')" --> onMouseover="showmenu(event,linkset[2], '115px')" --> etc..



<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>

<style type="text/css">

.left-container{float:left;}
.right-container{float:right;}
.color-box{border: 1px solid ; width: 50px; height: 50px; margin-bottom:20px;}
#blue{background-color: rgb(51, 51, 255);}
#red{background-color: rgb(255, 51, 51);}
#purple{background-color: rgb(204, 51, 255);}
#yellow{background-color: rgb(255, 204, 51);}

</style>

<script language=javascript type='text/javascript'>

var aryImages = new Array();

aryImages[1] = "http://www.flipoutdesign.com/images/flower-blue.jpg";
aryImages[2] = "http://www.flipoutdesign.com/images/flower-red.jpg";
aryImages[3] = "http://www.flipoutdesign.com/images/flower-purple.jpg";
aryImages[4] = "http://www.flipoutdesign.com/images/flower-yellow.jpg";

for (i=0; i < aryImages.length; i++) {
var preload = new Image();
preload.src = aryImages[i];
}

function swap(imgIndex, imgTarget) {
document[imgTarget].src = aryImages[imgIndex];
}


</script>

</head>

<body>

<div class="right-container">
<img alt="" onMouseover="showmenu(event,linkset[0], '115px')" onMouseout="delayhidemenu()" name="imgColor" src="images/flower-yellow.jpg" />
</div>

<div class="left-container">
<div class="color-box" id="blue" onclick="swap(1, 'imgColor')"></div>
<div class="color-box" id="red" onclick="swap(2, 'imgColor')"></div>
<div class="color-box" id="purple" onclick="swap(3, 'imgColor')"></div>
<div class="color-box" id="yellow" onclick="swap(4, 'imgColor')"></div>
</div>



</body>

</html>

Thanks