<p dir="auto">There is a bit of a UI bug when going from a selected dropdown item to one of its subitems. See:</p>
<p dir="auto"><a target="_blank" rel="noopener noreferrer nofollow" href="https://camo.githubusercontent.com/96e00cd2e58e2f3642c2b34b3fa5beea29d681e89374013d7143097a3243d9a7/687474703a2f2f7374617469632e74756d626c722e636f6d2f396867737779732f6955316d6a386336792f626f6f7473747261702d6275672e676966"><img src="https://camo.githubusercontent.com/96e00cd2e58e2f3642c2b34b3fa5beea29d681e89374013d7143097a3243d9a7/687474703a2f2f7374617469632e74756d626c722e636f6d2f396867737779732f6955316d6a386336792f626f6f7473747261702d6275672e676966" alt="example" data-animated-image="" data-canonical-src="http://static.tumblr.com/9hgswys/iU1mj8c6y/bootstrap-bug.gif" style="max-width: 100%;"></a></p>
<p dir="auto">Increasing the delay is one way to solve it, but the other is to detect the direction of the mouse cursor and apply a delay when the cursor is moving towards one of the submenus.</p>
<p dir="auto">This <a href="https://github.com/kamens/jQuery-menu-aim">repository</a> implements this (see example of how it works <a href="http://htmlpreview.github.io/?https://github.com/kamens/jQuery-menu-aim/blob/master/example/example.html" rel="nofollow">here</a>.</p>
<p dir="auto">It would be nice to have this as Bootstrap's default behavior.</p>
<p dir="auto">Bootstrap's hierarchical menus are a lot like Mac OSX, i.e., broken. I'd like to suggest two changes that would greatly improve usability:</p>
<ol dir="auto">
<li>Don't hide the menu when you click on a divider or bottom/top padding.</li>
<li>Implement mouse movement tracked submenu display, like the one invented by Apple in the 80's and currently used prominently in Amazon's homepage. More info <a href="http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown" rel="nofollow">here</a>.</li>
</ol>