jquery - 在jQuery中淡出元素并在其余部分中滑动

Question

我在页面上加载了一个图像网格。它们本质上div是相邻的，当页面填满时，它会移动到下一行。

当我单击一个图像时，我希望该图像淡出，一旦动画完成，我希望其余元素滑入以填充其位置。

我对点击和褪色没有问题，只是剩余元素的滑动。目前，他们只是在动画完成后立即跳跃以填补其位置。

编辑：忘记了 jsfiddle：http: //jsfiddle.net/YuFqh/

Answer 1

尝试这个：

$(".profileImage").click(function() {
    $(this).animate({opacity: "0.0"}).animate({width: 0}).hide(0);
})

将不透明度设置为 0 以使其从视图中淡出，然后将宽度设置为 0 以重新获得空间，然后将其隐藏以将其完全从可见性中移除。请注意，如果要重新显示，则必须恢复以前的值。

http://jsfiddle.net/Palpatim/YuFqh/2/

Answer 2

那么使用淡出回调呢

$(".profileImage").click(function() {

     $(this).animate({opacity:0},400, function(){
          // sliding code goes here
          $(this).animate({width:0},300).hide();
     });

});