超出页面高度的响应式菜单

Question

我有一个超出页面高度的响应式菜单，这意味着用户在短页面（内容很少的页面）上看不到较低的菜单项

jsfiddle -http://jsfiddle.net/ashconnolly/QDznX/

我知道这是因为我的导航是绝对定位的，但是如果我将导航设置为相对位置，它会将其下方的页面内容向下推。

我怎样才能更好地管理我的 html + css 来解决这个问题？

或

在javascript中，当body高度小于菜单高度时，如何设置body高度与菜单相同？

希望你能帮忙！

Answer 1

你可以通过 CSS 实现这一点

只需为 nav.active 的溢出和高度添加几个 css 属性

 nav.active {
        transform: translate3d(0,0,0);
        -webkit-transform: translate3d(0,0,0);
     height: 100%;
        overflow: auto;
    }

这是一个

fiddle