长下拉菜单在悬停时拉背景

Question

我正在使用一个专门为想要显示大量链接的人设计的菜单，而不会在浏览器下方消失。 相反，一旦菜单达到最大高度，它就可以让用户在其中滚动。

一旦达到这个高度，菜单就会调用javascript创建这个“子菜单”，但是，当这样做时，将菜单的背景下拉到内部菜单的底部，当我将鼠标悬停在其上时ul的宽度已扩大。

我创建了一个演示小提琴：

http://jsfiddle.net/H3Gb3/

请使用jQuery 1.6.4查看它是否有效。

看起来如何，我希望它看起来如何。如果您首先将鼠标悬停在平均菜单上，这也是我希望它对长菜单做出反应的方式。 但是如果你尝试前两个菜单 - 超过最大高度并执行子菜单的js，它们会扭曲整个菜单。 我使用了渐变背景，因此您可以更好地了解正在发生的事情。 此外，您可以注意到，在悬停后，它们不会返回到同一个地方。

我不知道造成这种情况的原因。我起初认为这是一个z-indez问题，但通过反复试验无法揭开它。

我在这里搜索了一个解决方案，发现其他人正在使用这个菜单并遇到了同样的问题，但是没有人可以提供解决方案。

谁能告诉我歪曲菜单到底发生了什么？这是一个CSS问题吗？

Answer 1

检查出来：http://jsfiddle.net/H3Gb3/2/

我在这里更改了你的代码：

 $container
       .css({
           height: maxHeight,
           width: "250px",
           overflow: "hidden"
        })

到

$container
       .css({
          width: "250px",
        })