Bootstrap 3動畫欄大小調整

Question

希望能在這裏改進我​​的代碼並吸取任何人的反饋意見。

我有一個按鈕，點擊後會隱藏/顯示側邊欄。

問題：當我切換邊欄時，內容區域偶爾會跳躍，而不是平滑地擴展/收縮。這不是100％的時間，所以我很難診斷原因。

這是我的jsFiddle，我正在與它一起玩耍。

http://jsfiddle.net/ryhollingsworth/Vb74j/

這是怎麼回事：

$('#toggler').on('click', function(e) { 
    e.preventDefault(); 
    $('#content').toggleClass('col-sm-12 col-sm-9');    
    $('#sidebar').toggleClass('col-sm-3 col-sm-0'); 
}); 

簡單地交換列寬了。我創建了一個新的列類col-sm-0。

謝謝:)

Answer 1

分配.col-sm-0一個min-height: 1px（如引導確實爲它的列），並刪除height: 0px風格。

http://jsfiddle.net/mblase75/4aTnN/

.col-sm-0 { 
    width: 0px; 
    float: left; 
    overflow: hidden; 
    margin: 0px; 
    padding: 0px; 
    min-height: 1px; 
}