如何避免垂直下拉菜单在底部添加垂直滚动条？

Question

我不知道如何完美地制订我的问题，所以我做了（快），例如这样会正好说明我的问题：http://jsfiddle.net/kn5GT/1/

如果最后一项是接近底部，你悬停它，子菜单将可以像其他显示一样，但这会延长页面的高度，从而显示浏览器的垂直滚动条。

我想避免这种情况，通过使所有下拉显示不是从上而是从底部（子菜单的底部将接近底部）来扩展页面的高度。

这是可能的只有在CSS或我必须把一些JS的呢？

Answer 1

这可能不是最好的解决方案，但你可以用css-pseudoclass nth-last-of-type()的一点帮助来解决这个问题。

我已经修改your fiddle（边界只是有更好的视觉区别）

我刚添加以下规则：

ul>li:nth-last-of-type(-n+2)>div { 
    top:auto; 
    bottom: 50px; 
} 

不要被怪选择迷茫，本质上(-n+2)使最后2个子菜单​​从底部弹出而不是从顶部弹出。