隱藏兄弟姐妹後緩慢中心div jQuery

Question

我有長的div包含我的網站上的一些用戶的圖像。 我似乎無法弄清楚如何在隱藏其兄弟姐妹後緩慢居中div。

http://jsfiddle.net/sXpT3/

我的問題是如何躲在別人後面添加我的jQuery腳本慢慢中心股利點擊， 。

我試圖使用動畫，但似乎沒有工作，如果我不把每個div放在絕對模式。

CSS

.users { 
    width:100%; 
    text-align:center; 
    height: 100px; 
    top:50%; 
    margin-top:-100px; 
    position:absolute; 
} 

.user { 
    display:inline-block; 
    *display:inline; 
    width:90px; 
    height:90px; 
    margin:0 10px; 
    border-radius:50px; 
    border:5px solid rgba(255,255,255,0.9); 
} 

jQuery的

$(function() { 
    $('.user').click(function() { 

     if ($(this).hasClass('active')) { 
      $('.user').not(this).fadeIn(200); 

      $(this).removeClass('active'); 
     } else { 

      $('.user').not(this).fadeOut(200); 

      $(this).addClass('active'); 
     } 

    }); 
}); 

HTML

<div class="users"> 
    <div style="background:#0F9" class="user"> 
    </div> 
    <div style="background:#0CF" class="user"> 
    </div> 
    <div style="background:#F66" class="user"> 
    </div> 
    <div style="background:#F09" class="user"> 
    </div> 
    <div style="background:#FCF" class="user"> 
    </div> 
    <div style="background:#996" class="user"> 
    </div> 
</div> 

Answer 1

通過僅褪色出來，而不是隱藏它，然後動畫隱藏，我可以完成你的效果」重新尋找。
小提琴：http://jsfiddle.net/sXpT3/1/
JS：

$(function() { 
    $('.user').click(function() { 

     if ($(this).hasClass('active')) { 
      $(this).removeClass('active'); 
      $('.user').not(this).show(200).fadeTo(200,1); 
     } else { 

      $(this).addClass('active'); 
      $('.user').not(this).fadeTo(200,0).hide(200); 
     } 

    }); 
});