jquery - jQuery UI スケール効果のアニメーション境界は、アニメーション中に静的なままです

Question

ボックスをクリックすると縮小され、完全に消えると、他のボックスがその場所に移動します。遷移がより自然に見えるように、ボックスが縮小された要素のサイズに比例して移動し始めるように、この動作を変更することは可能ですか?

http://jsfiddle.net/XuDxR/

<div id="d0">AAAAAA</div>
<div id="d1">AAAAAA</div>
<div id="d2">AAAAAA</div>
<div id="d3">AAAAAA</div>
<div id="d4">AAAAAA</div>​

$('div').on('click', function (e) {
    $(this).effect("scale", {
        mode: 'hide', easing: 'easeOutBounce'
    }, 500);
});
​

div
{
display:inline-block;
    border:1px solid black;
}​

Answer 1

これを試して：

$(this).animate({ width:0,height:0},  
                {
                  duration:500,
                  easing:'easeOutBounce',
                  complete:function(){
                      $(this).css('display','none');
                  }
                }
);