title: Bootstrap 3 Animated Column Resizing
body: <p>Hoping to improve my code a bit here and taking anyone's feedback to help.</p>
  
  <p>I have a button that when clicked will hide/show the sidebar.</p>
  
  <p><strong>Problem: when I toggle the sidebar the content area occasionally jumps instead smoothly expanding/contracting. It's not 100% of the time so I'm having a hard time diagnosing the cause.</strong></p>
  
  <p>Here's my jsFiddle where I'm toying around with it.</p>
  
  <p><a href="http://jsfiddle.net/ryhollingsworth/Vb74j/" rel="nofollow">http://jsfiddle.net/ryhollingsworth/Vb74j/</a></p>
  
  <p>What's going on:</p>
  
  <pre><code>$('#toggler').on('click', function(e) {
      e.preventDefault();
      $('#content').toggleClass('col-sm-12 col-sm-9');             
      $('#sidebar').toggleClass('col-sm-3 col-sm-0');
  });
  </code></pre>
  
  <p>Simply swapping column widths out. I created a new column class of col-sm-0. </p>
  
  <p>Thanks :)</p>