I don't get why is detecting the mouse direction necessary in the case of the Amazon dropdown; I can see the utility in the Bootstrap example that the article highlights, but if the dropdown menu and its submenus both fit in a perfect square, wouldn't it be enough to detect whether the cursor is inside of either the menu or the submenu to properly show/hide the dropdown and its submenus? What are the drawbacks of this method compared to detecting the mouse direction like the article suggests?
The issue is that when you are hovering over a menu item, and you are aiming to hit a submenu item that is not directly to the right of the menu item. For example, if you are hovering over a menu item and wish to select a a submenu item that is to the right and down the screen, you will take a down-right path UX wise. Normally this would trigger the menu items below (before you make it to the submenu) and thus change the submenu items.
Pretty sure that's possible without tracking the direction of the mouse, by simply not hiding/showing the submenu but changing its contents when the mouse hovers over a different menu element.
