如何淡出图像，然后使其出现在jquery中的另一个位置

How to fadeout image, then make it appear on another position in jquery?

本文关键字：jquery 位置 另一个 何淡出 淡出 然后 图像      更新时间：2023-09-26

我的图像在某个div，它的z指数是最高的

当我点击某样东西时，我希望它淡出，淡入另一个指定的位置。在另一个类的图像下方：）这是一个"aaa"类。

我是这样做的：

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

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

这将可以： 

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

由于fadeOut和fadeIn是异步函数，因此脚本将继续运行，这会导致img立即更改其位置。

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

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

克隆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();
    );
相关文章：