Smooth immagine fade out, cambiare src, e dissolvenza con jQuery

Question

che sto cercando di fare quanto segue:

Sul collegamento clic:

1.) fade out un img

2.) cambiare lo src dell'immagine ora nascosta

3.) quando l'img src con il nuovo termine del caricamento, fade in

minimamente, mi piacerebbe vedere una dissolvenza liscia in un'immagine e una dissolvenza in di un nother (all'interno dello stesso tag img src cambiando la)

Alla fine mi piacerebbe:

1.) fade out un img

2.) mostrano una animazione gif "loading image"

3.) cambiare lo src dell'immagine ora nascosta

4.) nascondere l'animazione gif "loading image"

5.) quando l'img src con il nuovo termina loa ding, fade in

Grazie.

Questo è quello che ho provato finora. Sembra fare un paio di flash, ma solo dopo le modifiche src (prima della dissolvenza in uscita). Strano comportamento.

$("#Image").fadeOut(); 
$("#Image").attr("src", NEW_IMAGE_SRC); 
$("#Image").fadeIn(); 

#Image è un tag IMG

Answer 1

Prova questo:

$('.click').click(function() { 
    $('img.class').fadeOut(300, function(){ 
     $(this).attr('src','new_src.png').bind('onreadystatechange load', function(){ 
     if (this.complete) $(this).fadeIn(300); 
     }); 
    }); 
});