Any hierarchical menu in JavaFx (MenuBar, ContextMenu,...) works by activating its sub menu on hover. Because MenuItems are typically layed out vertically this means though, that in the case of more than one sub menu, if the user starts moving the mouse directly towards the target sub menu, she is very likely to accidentally hover over a adjacent menu item, thus triggering its hover property instantly and showing another sub menu.
Here are some references discussing the issue and proposing solutions:
* Mark DiMarco: User Interface Algorithms [JSConf2014]
https://www.youtube.com/watch?v=90NsjKvz9Ns#t=1110
* Blog post by Ben Kamens
http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown
* Kamens JQuery implementation
https://github.com/kamens/jQuery-menu-aim
* Slope based implementation by Kamens
https://github.com/kamens/jQuery-menu-aim/blob/master/jquery.menu-aim.js#L215-L242
Expected behavior: The user should be able to move her mouse from the MenuItem directly towards a targeted sub MenuItem without triggering an adjacent MenuItem.
Here are some references discussing the issue and proposing solutions:
* Mark DiMarco: User Interface Algorithms [JSConf2014]
https://www.youtube.com/watch?v=90NsjKvz9Ns#t=1110
* Blog post by Ben Kamens
http://bjk5.com/post/44698559168/breaking-down-amazons-mega-dropdown
* Kamens JQuery implementation
https://github.com/kamens/jQuery-menu-aim
* Slope based implementation by Kamens
https://github.com/kamens/jQuery-menu-aim/blob/master/jquery.menu-aim.js#L215-L242
Expected behavior: The user should be able to move her mouse from the MenuItem directly towards a targeted sub MenuItem without triggering an adjacent MenuItem.