AngularStrap bs-dropdown with the "hover" trigger doesn't stay open long enough

Question

When using the bs-dropdown with the "hover" trigger, the menu doesn't stay visible long enough to allow the user to click on a menu item:

http://plnkr.co/edit/Fi39BdCOqHXnPAgITD01?p=preview

Using a delay makes it behave in unexpected ways:

http://plnkr.co/edit/Y2Q63DDJEyP9CTPMUfYD?p=preview

Ideally the dropdown should stay up as long as the mouse is on the menu, and disappear when the mouse leaves the menu.

Answer 1

That is because hover pseudoevent's mouseleave gets triggered when you hover out of the button to focus on the actual dropdown. Instead you can try providing the container as button itself. Example

<button type="button" 
        class="btn btn-lg btn-primary myButton" 
        bs-dropdown="dropdown" 
        data-container=".myButton">Hover to toggle dropdown</button>

Here i added data-container as myButton which is the class i gave for the same button.

Plnkr

Using delay on hide is of no effect since the hide will eventually happen after the specified delay as the animation gets queued, as you hover out of the button and is going to hide after the delay so you should expect the user to be quick enough to select the dropdown option. But as a work around you can just use container till there is a fix provided for this.