hình ảnh mượt mà mờ dần, thay đổi src, và mờ dần với jquery

Question

Tôi cố gắng để làm như sau:

Mở liên kết nhấp chuột:

1.) mờ dần một img

2.) thay đổi src của hình ảnh tại ẩn

3.) khi img src với mới kết thúc tải, phai trong

Tối thiểu, tôi muốn xem một phai mịn ra khỏi một hình ảnh và một fade in của một Nother (trong thẻ img cùng bằng cách thay đổi src)

Cuối cùng tôi muốn:

1.) mờ dần một img

2.) cho thấy một gif "hình ảnh tải" hoạt hình

3.) thay đổi src của hình ảnh tại ẩn

4.) ẩn gif "hình ảnh tải" hoạt hình

5.) khi img src với mới kết thúc loa ding, fade in

Cảm ơn.

Đây là những gì tôi đã thử cho đến nay. Nó dường như làm một vài nhấp nháy nhưng chỉ sau khi thay đổi src (trước khi phai ra). Hành vi kỳ lạ.

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

#Image là một thẻ IMG

Answer 1

Cố gắng này:

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