mouseover change images

Hi people,

I’ve put together a piece of javascript to change images… But I am a complete idiot when it comes to JavaScript, so off course it didn’t work :p

What I’m trying to do: I’m working with a rating system on my site. I want to reproduce the same idea that is used on entertainment.msn.com (at the photographs). There are 5 stars there, that display the current rating. But when you mouse over a star, for example the 3rd, the first 3 stars become yellow, the other 2 gray.

This is the code that doesn’t work:

<script language=”JavaScript”>

// Preload Stars ::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::::
img_star_sel = new Image();
img_star_sel.src = “http://www.rijkvanwel.nl/e107/e107_images/rate/msn/6.gif“;
img_star_on = new Image();
img_star_on.src = “http://www.rijkvanwel.nl/e107/e107_images/rate/msn/5.gif“;
img_star_off = new Image();
img_star_off.src = “http://www.rijkvanwel.nl/e107/e107_images/rate/msn/1.gif“;

function starsel(rate,over)
{// Calculate number of stars ::::::::::::::::::::::::::::::::::::::::::::::
var stars_on = rate;
var stars_off = 5 – rate;

// Mouse over / mouse out :::::::::::::::::::::::::::::::::::::::::::::::::
if (over = TRUE)
{// Change Images ::::::::::::::::::::::::::::::::::::::::::::::::::::::
document.star_1.src = img_star_sel.src;
if (stars_on > 1)
{document.star_2.src = img_star_sel.src;}
else
{document.star_2.src = img_star_off.src;}
if (stars_on > 2)
{document.star_3.src = img_star_sel.src;}
else
{document.star_3.src = img_star_off.src;}
if (stars_on > 3)
{document.star_4.src = img_star_sel.src;}
else
{document.star_4.src = img_star_off.src;}
if (stars_on > 4)
{document.star_5.src = img_star_sel.src;}
else
{document.star_5.src = img_star_off.src;}
}
else
{// Change Images ::::::::::::::::::::::::::::::::::::::::::::::::::::::
document.star_1.src = img_star_on.src;
if (stars_on >= 1,5)
{document.star_2.src = img_star_on.src;}
else
{document.star_2.src = img_star_off.src;}
if (stars_on >= 2,5)
{document.star_3.src = img_star_on.src;}
else
{document.star_3.src = img_star_off.src;}
if (stars_on >= 3,5)
{document.star_4.src = img_star_on.src;}
else
{document.star_4.src = img_star_off.src;}
if (stars_on >= 4,5)
{document.star_5.src = img_star_on.src;}
else
{document.star_5.src = img_star_off.src;}
}

}

</script>

Could someone please help me out here? Thanks in advance!!

Also in #JavaScript _↴