title: Adjust some CSS when Twitter bootsrap Dropdown Nav menu is finished it's operation
body: <p>I want use JS to make some adjustments to the CSS when the navigation dropdown in Twitter Bootsrap has finished it's operation. ( ie when it's fully down, fully up, or one of the sub menu operations finishes ). </p>
  
  <p>What I want to do is not particularly relevant I think, but it's basically just to do with changing the height of a background div to match the height of the dropdown.</p>
  
  <p>I have looked at the bootstrap collapse jquery but it's really too complex for me to figure out. Can anyone tell me what I should be hooking into of if there's an easier way of achieving this.</p>
  
  <p>Here is the relevant code:  What I want to do is to have something fire when this dropdown is fully extended</p>
  
  <pre><code>&lt;div class="navbar"&gt;
  &lt;div class="navbar-inner"&gt;
  &lt;div class="container"&gt;
  
  &lt;!-- .btn-navbar is used as the toggle for collapsed navbar content --&gt;
  &lt;a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse"&gt;
  &lt;span class="icon-bar"&gt;&lt;/span&gt;
  &lt;span class="icon-bar"&gt;&lt;/span&gt;
  &lt;span class="icon-bar"&gt;&lt;/span&gt;
  &lt;/a&gt;
  
  &lt;!-- Be sure to leave the brand out there if you want it shown --&gt;
  &lt;a class="brand" href="#"&gt;Project name&lt;/a&gt;
  
  &lt;!-- Everything you want hidden at 940px or less, place within here --&gt;
  &lt;div class="nav-collapse collapse"&gt;
  &lt;nav &gt;
  &lt;ul class="nav"&gt;
      &lt;li &gt;&lt;a href="#"&gt;Home&lt;/a&gt;&lt;/li&gt;
      &lt;li &gt;&lt;a href="#"&gt;About&lt;/a&gt;&lt;/li&gt;
      &lt;li &gt;&lt;a href="#"&gt;Pages&lt;/a&gt;&lt;/li&gt;
      &lt;li &gt;Pages&lt;/a&gt;
      &lt;ul class="sub-menu"&gt;
          &lt;li &gt;&lt;a href=""&gt;Quamquam tu hanc copiosiorem&lt;/a&gt;&lt;/li&gt;
          &lt;li &gt;&lt;a href=""&gt;Quamquam tu hanc copiosiorem&lt;/a&gt;&lt;/li&gt;
          &lt;li &gt;&lt;a href=""&gt;Quamquam tu hanc copiosiorem&lt;/a&gt;&lt;/li&gt;
      &lt;/ul&gt;
      &lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p>
      </p>
  
  <pre><code>&lt;/div&gt;
  &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>