如何淡出图像，然后让它出现在jquery的另一个位置？

Question

我的图像是在一些div，它的Z指数是最高的

当我点击某件东西时，我希望它淡出，并淡入另一个指定的位置。在另一个班的形象之下：）这是一个“aaa”班。

我做这样的：

  $('img.classy').fadeOut(); 
      $('img.classy').css('top',$(el).find('img.aaa:last').height()+60); 
      $('img.classy').fadeIn(); 

它嵌入到单击事件。当我运行它并单击该区域时，img.classy首先更改它的位置，然后在新位置上淡出并淡入。我明显想要这样做：淡出 - >在不可见时更改位置 - >淡入淡出位置。怎么做？

Answer 1

您需要等到fadeOut完成。我为你添加了一个回调函数。

$('img.classy').fadeOut('slow', function() { 
    $(this).css('top',$(el).find('img.aaa:last').height()+60); 
    $('img.classy').fadeIn(); 
}); 

Answer 2

这样做：

$('img.classy').fadeOut(function() { 
    $('img.classy').css('top',$(el).find('img.aaa:last').height()+60); 
    $('img.classy').fadeIn(); 
}); 

因为fadeOut和fadeIn是异步函数，该脚本将继续运行，那些导致你img立即改变其位置。

Answer 3

这将克隆的IMG，删除它，然后将其追加anothor包装：

.aaa {position: relative} 
    .classy {position: absolute; right:0; top:0} 

    $('img.classy').fadeOut(
     cloned = $(this).clone(true); 
     $(this).remove(); 
     $("img.aaa:last").append(cloned); 
     $(".classy").fadeIn(); 
    );