css - 没有 JS 的下拉菜单

Question

我一直在寻找没有 JS 的下拉菜单 - 但没有任何运气。我正在尝试构建一个类似于vimeo.com上的菜单，但是关于制作 dropline 的大多数教程都使用这样的东西：

.submenu { display:none; }
li.item:hover > .submenu { display:block; }

Insted 我想使用溢出：隐藏；显示子菜单。像这样的东西：http: //jsfiddle.net/tuplet/Jv77L/

在这个例子中，当你悬停一个列表项时，我使用 jQuery 来确定 #top 的高度从 40px 到 80px。这实际上是我的主要问题，因为我不知道没有 jQuery 怎么做？悬停 li 时如何更改#top 高度？

我不知道这是否可能（或最好的方法），但如果您有想法，请告诉我:)

谢谢

Answer 1

删除 javascript，将其添加到您的 css：

#top:hover { 
    height:80px;
}