Forum Moderators: open
I am using the following generic code to create an image rollover using javascript. The script works fine locally but has problems when viewed online. Other times it works, other not.
I would appreciate if you could tell me what is wrong with the following code and what should be fixed so that it plays online and cross-browser:
-------HTML CODE BEGINS HERE-------
<html>
<head>
<script language="javascript" type="text/javascript">
var preloadimages=new Array("Button1.jpg","Button1_mouseover.jpg","Button1_mouseclick.jpg");
var theimages=new Array();
for (p=0;p<preloadimages.length;p++){
theimages[p]=new Image();
theimages[p].src=preloadimages[p];}
function roll(img_name1, img_src1)
{
document[img_name1].src = img_src1;
}
</script>
</head>
<body>
<A HREF="javascript:void(0)"
onmouseover="roll('Button1','Button1_mouseover.jpg')"
onmouseout="roll('Button1','Button1.jpg')"
onmousedown="roll('Button1','Button1_mouseclick.jpg')"
onmouseup="roll('Button1','Button1_mouseover.jpg')">
<IMG SRC="Button1.jpg" NAME="Button1" BORDER="0">
</A>
</body>
</html>
-------HTML CODE ENDS HERE-------
Thank you in advance!
Aris
and you roll function should be like this:
document.getElementById(img_name1).src = img_src1;
or you can simple change roll function to this
button1.src=img_src1;
good luck to you
