Maybe someone can tell me what, if anything, is wrong with this JavaScript and associated HTML. This is basically a rollover for the titleX.jpg image and is coupled with the imagemenu at http://www.phatfusion.net/imagemenu/. I have made changes from the imagemenu code, but the bulk of what I am doing (especially from a JavaScript perspective) is below:
Here is the HTML from my site for the relevant part:
<div class="floatArea">
<div class="genericBorder" style="overflow:hidden; width:480px; height:280px;">
<div id="imageMenu">
<ul>
<li class="featured1">
<a href="/index.php?act=1" onmouseover="activate1('title')" onmouseout="deactivate1('title')">
Item One
</a>
</li>
<li class="featured2">
<a href="/index.php?act=2" onmouseover="activate2('title')" onmouseout="deactivate1('title')">
Item Two
</a>
</li>
<li class="featured3">
<a href="/index.php?act=3" onmouseover="activate3('title')" onmouseout="deactivate1('title')">
Item Three
</a>
</li>
<li class="featured4">
<a href="/index.php?act=4" onmouseover="activate4('title')" onmouseout="deactivate1('title')">
Item Four
</a>
</li>
<li class="featured5">
<a href="/index.php?act=5" onmouseover="activate5('title')" onmouseout="deactivate1('title')">
Item Five
</a>
</li>
</ul>
</div>
<div>
<img src="featured/title0.jpg" alt="Title Bar" name="title" width="480" height="50"/>
</div>
</div>
<script type="text/javascript">
window.addEvent('domready', function(){var myMenu = new ImageMenu($$('#imageMenu a'),{openWidth:300, border:2, onOpen:function(e,i){window.location=(e);}});});
</script>
</div>
Here is the associated javascript file:
if(document.images){
title0 = new Image();
title0.src = "featured/title0.jpg";
title1 = new Image();
title1.src = "featured/title1.jpg";
title2 = new Image();
title2.src = "featured/title2.jpg";
title3 = new Image();
title3.src = "featured/title3.jpg";
title4 = new Image();
title4.src = "featured/title4.jpg";
title5 = new Image();
title5.src = "featured/title5.jpg";
}
function activate1(image_name){
if (document.images){
document[image_name].src = eval(image_name + "1.src");
}
}
function activate2(image_name){
if (document.images){
document[image_name].src = eval(image_name + "2.src");
}
}
function activate3(image_name){
if (document.images){
document[image_name].src = eval(image_name + "3.src");
}
}
function activate4(image_name){
if (document.images){
document[image_name].src = eval(image_name + "4.src");
}
}
function activate5(image_name){
if (document.images){
document[image_name].src = eval(image_name + "5.src");
}
}
function deactivate1(image_name){
if (document.images){
document[image_name].src = eval(image_name + "0.src");
}
}