<a href="#"
 onmouseover="document.images.img0.src='res/hello_over.gif';"
 onmouseout="document.images.img0.src='res/hello.gif';"
 onmousedown="document.images.img0.src='res/hello_down.gif';"
 onclick="document.images.img0.src='res/hello_click.gif'; return false;"><img
 src="res/hello.gif" width="250" height="100" alt="hello" name="img0"></a>

The image must have a NAME attribute in order to be controlled with this form of javascript, e.g.,   name="img0"

onmouseover events can handle multiple scripts, separated by a semi-colon, e.g.,
  onmouseover="document.images.img0.src='res/hello_over.gif'; document.images.letter0.src='res/b.gif';"

(remember to terminate your onclick events with return false;
this prevents the browser from attempting to follow the href's url)