带有转换的下拉菜单

Question

经过长时间的javascript编码后，我想尝试一个没有任何 javascript（并且当然没有jQuery）的漂亮网站。我想要一个包含此网站标签的下拉菜单：dropdown tabs。但这个是javascript。我做到了：http://jsfiddle.net/jHeRm/。但是当我添加过渡时，我遇到了一个问题：过渡是从一个点到另一个点，我无法知道没有计算的起点（li的高度* li的数量）。

如何以任何方式进行此转换，但没有jQuery，javascript，php，ID和类？

编辑我想通过从bottom:0px过渡到top:21px来实现这一目标，但转换始终从top:0px开始到{{ 1}}

Answer 1

您可以使用CSS并设置嵌套ul的高度：

http://jsfiddle.net/jHeRm/2/

---

以下是使用负边距的更新版本：

http://jsfiddle.net/jHeRm/4/