在JQuery ui菜单中滚动子菜单

以下问题说明了如何在JQuery-ui菜单中使用垂直滚动条： JQuery UI Menu Scroll

这很好，但似乎这样做不适合子菜单。子菜单有时会在其父级底部创建一个水平滚动条而不是向右延伸。最终，我希望主菜单和我的子菜单都能正确滚动，而不是任何horrizontal滚动条。

你可以在这个小提琴中看到： http ： //jsfiddle.net/kPVKL/菜单“两个”将打开正常，但菜单“三”只显示一个horrizontal滚动条。

我怀疑我的问题在这里：

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

提前致谢。

这个小提琴 – 从我黑客攻击相同的问题（和其他人，抱歉无关的stuf） – 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 ui正在构建DOM的方式看起来很好 – 所有子菜单都是位置：绝对的，我看不出为什么它们应该相互嵌入的任何理由; 但正如你所指出的那样，第三级子菜单以某种方式嵌入到二级子菜单中。