Menu
I have the following script working fine but what I need to do is change the text that appears below the big photo when the respective thumbnail is moused over, i.e., when the mouse is over pic1thumbnail, text related to pic1Big.jpg is displayed at the bottom and when the mouse is over pic2thumbnail, text related to pic2Big.jpg is displayed at the bottom. Any ideas how to achieve this?
<html>
<head>
<script type=”text/javascript” language=”javascript”>
<!–
function update(url,index,isSuper) {
document[‘PhotoBig’].src=url;
}
//–>
</script>
</head>
<body>
<div style=”float:left;”>
<ul style=”list-style:none; margin:0; padding:0;”>
<li style=”float:left;”><a onMouseOver=”update(‘pic1Big.jpg’, 0, false); return false;”><img src=”pic1thumbnail.jpg” alt=””></a>
<li style=”float:left;”><a onMouseOver=”update(‘pic2Big.jpg’, 1, true); return false;”>
<img src=”pic2humbnail.jpg” alt=””></a>
</ul>
</div>
<ul style=”list-style:none; margin:0; padding:0;”>
<li><img src=”pic1Big.jpg” alt=”” name=”PhotoBig”>
<div>Text under pic1Big</div>
</ul>
</body>
</html>