Animate bootstrap columns

This could be done with CSS3 transitions, which would be consistent with the way Bootstrap JS plugins accomplish their animations.

HTML

<div class="container">
  <div class="row">
    <div id="col2" class="span0"></div>
    <div id="col1" class="span12">
      <a id="trig" class="btn btn-inverse">Reflow Me</a>
    </div>
  </div>
</div>​

JS

$('#trig').on('click', function () {
  $('#col1').toggleClass('span12 span3');
  $('#col2').toggleClass('span0 span9');
});​

CSS

.row div {
    -webkit-transition: width 0.3s ease, margin 0.3s ease;
    -moz-transition: width 0.3s ease, margin 0.3s ease;
    -o-transition: width 0.3s ease, margin 0.3s ease;
    transition: width 0.3s ease, margin 0.3s ease;
}

.span0 {
    width: 0;
    margin-left: 0;
}

JSFiddle

JSFiddle (Fluid)

_{Note: The animation is a still a bit imprecise, but I figure that can all be worked out separately. This answer provides the basic outline of how to go about it.}