样式化CSS以提供本机应用程序的感觉

Question

我希望我的无序列表使用jquerys手风琴功能进行动画处理，以占据屏幕的整个宽度和高度，以提供原生移动应用程序的感觉。其中一个列表元素将一直被删除。

这是jsfiddle

http://jsfiddle.net/SteveRobertson/Rm66M/5/

如何通过严格操纵CSS来完成这项工作？

使用id = celebs，#celebs对div图层进行动画制作 我添加了

    body, celebs, and html styling to remove all margins and padding

如何完全占据视野的整个高度？

Answer 1

我不确定您正在寻找的感觉，但如果您希望您的部分占据窗户高度的100％：

html, body, #celebs, #accordion, li.active {
    height: 100%;
}

请记住，这将使活动的li占据窗口的整个高度。如果你希望它“在显示其他关闭部分之后占用剩下的任何垂直空间”，你需要做一些数学运算。 （窗口高度 - 其他li的组合高度=剩余用于调整活动li的大小。）

如果您愿意，您也可以尝试使用jQueryUI的手风琴与heightStyle: "fill"（http://jqueryui.com/accordion/#fillspace）