title: collapse transition not working with angular's UI Bootstrap
body: <p>I'm trying to create a div which will show / hide when a button is clicked.  The <a href="https://angular-ui.github.io/bootstrap/">UI Bootstrap page</a> shows a nice simple example that uses a css transition.</p>
  
  <p>Here's my <a href="https://jsfiddle.net/xv7tws10/">fiddle</a> where I copy their code, almost exactly (slight change to make html syntax highlighting work, and a line to declare my "app" in the js).</p>
  
  <p>As you can see, it doesn't work as in the example -- there is no transition.  Why not?  Maybe a css transition rule is needed -- but isn't that part of what bootstrap.css provides?</p>
  
  <hr>
  
  <p>for posterity, the equivalent html file from the fiddle would be:</p>
  
  <pre><code>&lt;html&gt;
  &lt;head&gt;
      &lt;link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" /&gt;
      &lt;link rel="stylesheet" type="text/css" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap-theme.min.css" /&gt;
      &lt;script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.15/angular.min.js"&gt;&lt;/script&gt;
      &lt;script src="https://cdnjs.cloudflare.com/ajax/libs/angular-ui-bootstrap/0.13.0/ui-bootstrap.js"&gt;&lt;/script&gt;
  
  &lt;/head&gt;
  &lt;body ng-app="my_app"&gt;
      &lt;div ng-controller="CollapseDemoCtrl"&gt;
          &lt;button class="btn btn-default" ng-click="isCollapsed = !isCollapsed"&gt;Toggle collapse&lt;/button&gt;
          &lt;hr /&gt;
          &lt;div collapse="isCollapsed"&gt;
              &lt;div class="well well-lg"&gt;Some content&lt;/div&gt;
          &lt;/div&gt;
      &lt;/div&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>and the equivalent .js would be:</p>
  
  <pre><code>var my_app = angular.module('my_app', ['ui.bootstrap']);
  
  my_app.controller('CollapseDemoCtrl', function ($scope) {
      $scope.isCollapsed = false;
  });
  </code></pre>
  
  <p>Thanks!</p>