在JQuery ui菜单中滚动子菜单

Question

下面的问题说明如何在JQuery菜单中使用垂直滚动条：JQuery UI Menu Scroll

这是好的，但似乎这样做不是很好的子菜单。子菜单有时会在父菜单底部创建一个可怕的滚动条，而不是向右扩展。最终，我希望主菜单和子菜单都能垂直滚动，没有任何可怕的滚动条。

正如你在这把小提琴上看到的：http://jsfiddle.net/kPVKL/菜单“2”会打开很好，但是菜单“3”只显示一个可怕的滚动条。

我怀疑我的问题是：

     .ui-menu {
               width: 150px;
               height: 200px;
               overflow-y: scroll;
      }

1. 我哪里出错了？
2. 有没有更好的方法？我唯一的限制是我必须使用jquery菜单，其他的都可以。

提前谢谢。

Answer 1

这把小提琴--来自我用同样的问题进行黑客攻击-- (和其他人一样，抱歉，不好意思) -- http://jsfiddle.net/marvmartian/VT37s/ --在Chrome和FF中工作。在ui菜单CSS上，关键似乎是“位置:固定的！重要的”：

.ui-menu {
    width: 150px;
    height: 70px;
    overflow-x: hidden;
    overflow-y: scroll;
    z-index: 100 !important;
    position: fixed !important;
}

我不知道这是怎么回事。对jquery构建DOM的检查看起来不错--所有的子菜单都是位置:绝对的，我看不出它们为什么应该相互嵌入；但是，正如您所指出的，第三级子菜单以某种方式嵌入到第二层子菜单中。