当有许多孩子而没有“孙子”节点时，超级鱼下拉列表将被列入圆柱状
我有一个使用jquery superfish的水平导航菜单。 在我的一个下拉菜单中，其中不再有下拉菜单（即没有孙子节点），但有几个孩子（现在确切地说是45个孩子，它可能会及时上升或下降）。 我正试图找到一种方法让下拉列表超过一定数量。 15对我来说很有效，因为有45个。所以没有显示所有包含这里的html列表 – 并且为了更少的代码我将使用15：
所以，如果我希望列从5开始，我就有3列。 我无法弄清楚我是如何做到这一点而不是打破一切。 我尝试过使用一些css并没有找到解决方案。
如果列表中有45个项目，我建议你使用mega下拉脚本而不是superfish。
更新：如果你想要一个很好地降级的多列下拉菜单，那么为什么不去一个CSS菜单呢？ 查看多列菜单 ， 专业下拉列表1 ， prodropdown列表2 ， CSS3多幻灯片甚至垂直弹出列表 。
更新＃3：好的，因为我的强迫症迫使我弄明白这一点，我今天在这个问题上工作了一段时间。 它不是很漂亮，但它确实有效。 这是一个演示 。
您将不得不重新格式化HTML：
将此CSS添加到标准中
.sf-menu .listwrap { position: absolute; top: -999em; max-height: 500px; /* adjust height as desired */ width: 45em; /* adjust width as more columns are added (~10em per column + shadow width */ } .sf-menu .listblock ul { position: relative; display: block; float: left; width: 10em; } .sf-menu li:hover ul, .sf-menu li:hover .listwrap, /* added two definitions to existing one */ .sf-menu li.sfHover .listwrap, .sf-menu li.sfHover ul { left: 0; top: 2.5em; /* match top ul list item height */ z-index: 99; } .sf-menu li:hover .listblock ul, .sf-menu li.sfHover .listblock ul { top: 0; left: 0; }