Animowanie atrybutu „src”

Mam dokument HTML. To wygląda tak:

Gdy użytkownik unosi obraz „stackinfo”, chcę, aby wyglądał tak:

Mój kod obrazu:

<img src="/Resources/Images/MainMenu/logo.png" name="Logo" width="100" height="30" class="MainMenu" id="Logo" />

Wiem, jak zmienićsrc obrazu na zawisie, ale jak mogę to animować?

(Chcę to zrobić za pomocą jQuery)

Co już próbowałem:

$(document).ready(function(){
       $('img[name="Logo"]').hover(function(event){
         $(this).fadeIn(function(event){
             $(this).attr("src","/Resources/Images/MainMenu/logoHover.png");
         });
       },
       function(event){
         $(this).fadeToggle(function(event){
             $(this).attr("src","/Resources/Images/MainMenu/logo.png");
         });  
       });
});

questionAnswers(7)

yourAnswerToTheQuestion