问题
I have been battling to find the error in my adaptation of the QTip2 Demo-menu for over a month now. My implementation is working great with the exception of only 2 remaining problems. Both are detailed below with a Fiddle. I really hope someone can help so that I can wrap up this project.
The 2 problems: http://jsfiddle.net/UGQ95/10/
The 'Tier 1' menu opens correctly and persists correctly whenever the user is not using the menu. This means that whenever the user has completed hovering any menu items, it returns to indicate the users current item. The behaviour of the menu is currently correct, holding open 'Tier 1' and 'Tier 2', whilst 'Tier 3' (if there is one) is highlighted on hover, but remains hidden until hovered.
Problem 1. You will notice the top tier, 'Tier 1', tries to force itself to the 'alwaysactive' item immediately on mouseleave when moving between 'Tier 1' items. I believe this is caused by the mouseleave trigger on the #navigation triggering prematurely. This JS is found in the last 10 lines.
Problem 2. In the fiddle provided, you will notice I have set 'Tier 1 - Maintenance', 'Tier 2 - Bus Stops', and 'Tier 3 - Create Bus Stop' to being the active page. When hovering the other 'Tier 2' items alongside 'Bus Stops', I cannot get the 'Tier 2' active item to lose its highlighting, until it needs to return to being shown as active.
Thanks so much if any of you can help! I really hope I was able to illustrate my problems clearly.
Cheers Devin
来源：https://stackoverflow.com/questions/10878726/mouseenter-mouseleave-triggering-prematurely-with-custom-tiered-menu-using-qtip2