добавление задержки для этой функции jquery

Question

Я использую jquery для обмена img src. Есть ли способ добавить эффект затухания, чтобы изображение искажалось, а не прямая мгновенная замена?

веселит

<img class="imgswap" data-alt-src="img1.jpg" src="img2.jpg" /> 
var sourceSwap = function() { 
    var $this = $(this); 
    var newSource = $this.data('alt-src'); 
    $this.data('alt-src', $this.attr('src')); 
    $this.attr('src', newSource); 
} 

$(function() { 
    $('img.imgswap').hover(sourceSwap, sourceSwap); 
}); 

Answer 1

Вы можете использовать следующие функции:

.mouseover(function() { 
    $(this).fadeOut(function(){ 
     //do the swapping 
     $(this).fadeIn(); 
    }); 
}) 

Answer 2

<img class="imgswap" data-alt-src="img1.jpg" src="img2.jpg" /> 

var sourceSwap = function() { 
    var newSource = $(this).data('alt-src'); 

    $(this).fadeOut(function(){ 
     $(this).data('alt-src', $(this).attr('src')); 
     $(this).attr('src', newSource); 

     $(this).fadeIn(); 
    }); 
} 

$(function() { 
    $('img.imgswap').mouseover(sourceSwap); 
}); 

Но я не уверен, что это будет в правильном контексте в этой функции.

UPD:http://jsfiddle.net/dehisok/X8ycM/1/

Исправление "очень быстро зависания" здесь.

if ($(this).hasClass('processing')) { 
    return; 
} 

$(this).addClass('processing'); 

И в конце концов:

$(this).removeClass('processing');