jquery - 将鼠标悬停在元素上时，防止下拉列表崩溃

这个问题不是很清楚，因为我不知道如何恰当地提问。
看看这个JSFiddle。
当您在我们周围徘徊时，会显示一个带有绿色小指针的下拉菜单。当鼠标移过指针时，菜单将折叠。
我想知道，是否有可能防止指针折叠菜单。
我试过将带有指针的div放在<li>标记中，但是jQuery变得棘手。
我还有什么可以试试的吗？

最佳答案

我将使用指针的边框来解决这个问题，并将它与悬停元素的psuedo类放在一起。
这将在IE7及以上版本中工作。

.menu > ul > li:hover > a:before {
    content: '';
    display:block;
    position: absolute;
    width: 0;
    height: 0;
    border-color: transparent;
    border-style: solid;
    bottom: -7px;
    left: 10px;
    margin-left: -5px;
    border-top-color: #445921;
    border-width: 7px 7px 0px 7px;
    z-index:9;
}

小提琴：
http://jsfiddle.net/mx877/