引導顯示/隱藏div左

Question

我試圖做一個站點使用引導程序，我遇到了一個問題，我幾乎可以，但並不完全解決。我想要做的是在md-2顯示屏上顯示div，並在按下按鈕時隱藏。關鍵是我希望主div在隱藏時位於12位，在10位位於左邊的位置時可以容納它。

我能夠顯示和隱藏它沒有問題，但我似乎得到主要股利相應地移動。我可以改變它的班級，但是我不能讓主顯示屏「移動」來適應它。發生什麼事可以在小提琴查看下面使用這個jQuery

$('#layerbutton').click(function() { 
    $(".map").toggleClass('col-md-12 col-md-10'); 
    $("#tree").toggle("slide"); 
}); 

http://jsfiddle.net/ujcdrj46/1/

我有一種感覺，有一個簡單的解決方案，這一點，但我就是沒有知識弄明白。感謝您的任何幫助，您可以提供。

另外，請原諒長長的小提琴，我不能讓它以任何其他方式工作。

Answer 1

您可以鏈.toggleClass()方法來達到理想的影響Demo

$('#layerbutton').on('click', function() { 
    $('#map').toggleClass('col-xs-10 col-md-10').toggleClass('col-xs-12 col-md-12'); 
    $("#tree").toggle("slide"); 
}); 

注：我添加了周圍的地圖div上Id屬性以及包括.col-xs-*顯示在撥弄這個工作。