面板应从底部向上滑动并向上推动内容,不得覆盖

Question

我对jQuery很新,但我几乎可以肯定我想要实现的目标是可能的.

我有一个页面,导航栏固定在底部.导航栏有一个按钮,可以切换一个额外的面板,我想从底部向上滑动.这是我到目前为止:http://jsfiddle.net/E4yGh/

如您所见,面板向上滑动到页面的其余部分,该页面保持不变.我想要的是让页面的其余部分向上滚动以显示面板.页面应该根据面板的高度精确向上滚动div,以便面板的底部固定在页面的底部 - 理想情况下,无需指定面板的高度,以便自动调整.

我该怎么做呢？

Answer 1

通过向上部div添加id,可以将slideToggle()应用于文本的上半部分.将以下行添加到您的jQuery单击函数:(这将切换整个上部div)

$("#upper").slideToggle("slow");

要仅将上部div滑动到底部的高度,您可以尝试使用CSS属性和.animate()

编辑:

一个简单的解决方案是将导航栏移动到页面顶部,并将文本的CSS位置更改为"relative". 这是一个例子

编辑:

以下是我相信你原本想要的东西:演示