[zevilz]

Есть страница категории с товарами. По умолчанию видны все товары из категории. Наверху страницы есть список с подкатегориями, при нажатии на которых исчезают те товары которые не соответствуют подкатегории. Подробности работы скрипта и демо вот здесь. При этом все неподходящие блоки захлапываются через animate(), что как то напрягает и жестоко смотрится при большом количестве товаров.

$(document).ready(function() {
 $('.menu li a').click(function() {
  $('.menu li').removeClass('selected');
  $(this).parent('li').addClass('selected');
    imgWidth = '52px';
    thisItem 	= $(this).attr('rel');
    if(thisItem != "all") {
     $('.item li[rel='+thisItem+']').stop()
       .animate({'width' : imgWidth, 
	 'opacity' : 1, 
	 'marginRight' : '.5em', 
	 'marginLeft' : '.5em'
     });
     $('.item li[rel!='+thisItem+']').stop()
      .animate({'width' : 0, 
      'opacity' : 0,
      'marginRight' : 0, 
      'marginLeft' : 0
     });
   } else {
    $('.item li').stop()
    .animate({'opacity' : 1, 
    'width' : imgWidth, 
    'marginRight' : '.5em', 
    'marginLeft' : '.5em'
   });
}
})

Сделал вот так:

.....
....
$('.item li[rel='+thisItem+']').stop().fadeIn()
  .animate({'width' : imgWidth, 
   'opacity' : 1, 
   'marginRight' : '.5em', 
   'marginLeft' : '.5em'
}, 700 );
$('.item li[rel!='+thisItem+']').stop()
  .fadeOut();
.....
.....

Сейчас все товары плавно исчезают и появляются, но при исчезновении ненужных товаров нужные резко перемещаются друг к другу. Как сделать плавное перемещение появившихся товаров друг к другу в то время, пока исчезают другие. Где-то видел такую реализацию, но так и не нашел. Борюсь с этим.