title: Trigger bootstraps collapse function on mouseover event
body: <p>I am using bootstrap for a navigation and want to open the collapsed menu not just on a button click but already when hovering the button.
  I can't even find the javascript code for the already programmed clicked events.</p>
  
  <p>That's the button to open the navigation:</p>
  
  <pre><code>&lt;button class="navbar-toggle collapsed" data-target="#main-nav" data-toggle="collapse" aria-expanded="false"&gt;
  </code></pre>
  
  <p>That's the navigation to be opened:</p>
  
  <pre><code>&lt;nav class="navbar navbar-fixed-top"&gt;
  &lt;div id="main-nav" class="navbar-collapse collapse" aria-expanded="false" style="height: 2px;"&gt;
  &lt;div class="container"&gt;
  </code></pre>
  
  <p><strong>My problem:</strong></p>
  
  <p>I don't know how to deal with bootstrap ( couldn't find in the documentation ) to use hover on the button to open the navbar.</p>
  
  <p>Code when the navigation is not collapsed:</p>
  
  <pre><code>&lt;button class="navbar-toggle" data-target="#main-nav" data-toggle="collapse" aria-expanded="true"&gt;
  
  &lt;nav class="navbar navbar-fixed-top in"&gt;
  &lt;div id="main-nav" class="navbar-collapse collapse in" aria-expanded="true" style=""&gt;
  &lt;div class="container"&gt;
  &lt;ul class="nav navbar-nav"&gt;
  &lt;li class="col-xs-12 col-sm-2 with-sub"&gt;
  &lt;li class="col-xs-12 col-sm-2 with-sub"&gt;
  </code></pre>