jquery - jQuery: Add fade effect to replace attr

Question

Is it possible to add a fade effect when using replace() to change image attributes? I have a code that uses a button to switch every image on the site to an alternate version (by changing the path of the image); I wanted each image to fade to its alternate version.

Here is the code:

$('.imgbutton').click(function() {
   $('img').attr("src",function(index,attr){
    return attr.replace("directory1/","directory2/");
});

Thanks for any help!

Answer 1

使用fadeOut和的组合fadeIn可以使这项工作：

$('.imgbutton').click(function() {
    $('img').fadeOut(function() {
        $(this).attr("src",function(index,attr) {
            return attr.replace("directory1/","directory2/");
        }).fadeIn();
    });
});