<shrug>
SO just move my code into a function.
</shrug>
Code:
<head>
function showImage(where,name)
{
where.src = name;
}
</head>
<body>
<img src="two.jpg" onmouseover="showImage('one.jpg');" onmouseout="showImage(this,'two.jpg');"/>
...
<img src="two.jpg" onmouseover="showImage('one.jpg');" onmouseout="showImage(this,'two.jpg');"/>
...
<img src="two.jpg" onmouseover="showImage('one.jpg');" onmouseout="showImage(this,'two.jpg');"/>
...
</body>
If the instructor insists that the onmouseover be on the <A> tag, instead, then there are a few solutions. But the most elegant is *still* to NOT need to pass the id/name of the <img> tag.
Instead, "find" the <img> as a subelement of the <a> tag!
Code:
<html>
<head>
<script>
function show(where,what)
{
var img = where.getElementsByTagName("img")[0];
img.src = what;
}
</script>
</head>
<body>
<A href="http://www.yahoo.com" onclick="return false;"
onmouseover="show(this,'one.jpg');"
onmouseout ="show(this,'two.jpg');"
><img src="two.jpg"></A>
<p>
<A href="http://www.yahoo.com" onclick="return false;"
onmouseover="show(this,'one.jpg');"
onmouseout ="show(this,'two.jpg');"
><img src="two.jpg"></A>
<p>
<A href="http://www.google.com" onclick="return false;"
onmouseover="show(this,'framitz.jpg');"
onmouseout ="show(this,'wookie.jpg');"
><img src="wookie.jpg"></A>
</body>
</html>