为什么jQuery效果在转换时不影响相对元素？

Question

我有这个带有四个相对于彼此定位的盒子的演示。当一个盒子长大时，我希望其他盒子调整它们的位置。在演示中，如果您将鼠标悬停在第一个框上，则转换将展开框。只有在它结束后，其他框才会跳到正确的位置。

如何让盒子与过渡一起移动？

$('body').on('mouseover', '#f', function (e) {
        $($(this)).effect("size", { to: { width: 181, height: 266} }, 1000);
    });

http://jsfiddle.net/XS93k/

Answer 1

这就是诀窍......

$('body').on('mouseover', '#f', function (e) {
           $(this).animate({
    height: '266px',
    width: '181px'
  }, 1000, function() {
    // Animation complete.
  }); });