I already solved your problem but here's the solution again just in case:

[a href="#" :bou::bou::bou::bou::bou::bou::bou:Over="document.the_image.src='dogbot1.gif';" :bou::bou::bou::bou::bou::bou::bou:Out="document.the_image.src='dogbot2.gif';"]
[img src="dogbot.gif" name="the_image" border="0"][/a]

Of course your replace the square brackets with pointy brackets.

dogbot.gif: original image
dogbot1.gif: what fading thing you want when the mouse goes over
dogbot2.gif: what fading thing you want when the mouse goes away (fade it back to dogbot.gif)

eg: http://www.geocities.com/ghettoprops30/doggy.html