Hey guys, I think I need a new set of eyes to help me look at my code which isn't working as what I've expected. Sorry for the relative ease of the question but I don't really code in Javascript. Anyways:
Basically what I'm trying to do is to get the image to change to an inversed version on mouse over. So far I'm only testing the image with the id "crew1". Here's the code:
<script type="text/javascript">
function imageChange(oldID) {
var a = "http://www.affiliateskeptic.com/wp-content/uploads/2010/06/face_placeholder_new.jpg";
var b = "http://www.affiliateskeptic.com/wp-content/uploads/2010/06/face_placeholder_new.jpg";
var c = "http://www.affiliateskeptic.com/wp-content/uploads/2010/06/face_placeholder_new.jpg";
var d = "http://www.affiliateskeptic.com/wp-content/uploads/2010/06/face_placeholder_new.jpg";
switch(oldID) {
case "crew1":
document.getElementById(oldID).src=a;
break;
case "crew2":
document.getElementById(oldID).src=b;
break;
case "crew3":
document.getElementById(oldID).src=c;
break;
case "crew4":
document.getElementById(oldID).src=d;
break;
}
}</script>
And the relevant HTML code is:
<div>
<img onmouseover="imageChange("crew1")" id="crew1" src="http://www.affiliateskeptic.com/wp-content/uploads/2010/06/face_placeholder.jpg" alt="Picture of Crew 1" width="224" height="235">
<p>Crew 1 character description.</p></div>
Sorry for the bad formatting but for some reason the closing tag for script and div are not displayed when I put them on a new line.
Thanks in advance for the help.