<a href="#"
   onmouseover="document.images.img0.src='res/hello_over.gif';
             document.images.letter0.src='res/b.gif';
             document.images.letter1.src='res/y.gif';"
   onmouseout="document.images.img0.src='res/hello.gif';
             document.images.letter0.src='res/c.gif';
             document.images.letter1.src='res/x.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" border="0"
 vspace="0" hspace="0" name="img0"></a>
<img src="res/a.gif" name="letter0" width="105" height="108">
<img src="res/z.gif" name="letter1" width="105" height="108">

note: secondary images are outside of the link tag