jQuery Hover image change animation
<p>I have an IMG tag with a grayscale image. I hooked up a Hover() event in order to change the "src" to a color image on hover, and back to grayscale on mouse-out. </p>

<p>This works just fine, however the change is abrupt. I'd like to add a slight fadeIn() to the effect so that the color appears to fadein and fadeout. I wrote the following which I thought would work, but doesn't. (The image changes, but there is no fade or delay to the effect). What am I doing wrong?</p>

<pre><code>            $("#showForm").hover(
              function () {
                $(this).fadeIn('slow', function(){
                    $(this).attr("src", 'images/AddButtonSmall.gif');
                });
              }, 
              function () {
                $(this).fadeIn('slow', function(){
                    $(this).attr("src", 'images/AddButtonSmallGray.gif');
                });
              }
            );
</code></pre>
