在不推送内容的情况下向下滑动div

我在这里有一个例子

我不知道如何让div向下滑动，但保持内容在顶部，因为当div滑下时不会向下滑动。

你能帮我解决这个问题吗？

Answer 1

你的意思是这样吗？

http://jsfiddle.net/yGZHC/3/

如果是这样，请使用position:absolute 。 这样，元素的位置不会影响其他元素的位置。

编辑：根据你想要做的事情， relative可能会更好。

http://jsfiddle.net/yGZHC/5/

EDIT2：甚至比这更好，动态使用高度来确定移动内容的距离。 这样你就不会被限制在一个固定的高度。

http://jsfiddle.net/yGZHC/7/

 $('#slidenav').animate({ top: '-'+$(this).height() }, 200); $('#open a').toggle( function(){ $('#slidenav').animate({ top: '0' }, 500); }, function(){ $('#slidenav').animate({ top: '-4'+$(this).height() }, 500); }); 

Answer 2

我把它固定在我认为你要求的东西上。

http://jsfiddle.net/yGZHC/2/

首先，将内容移到您想要的顶部内容之下：

 
 slide 
 
 
 
TITLE HERE
 
 
 
 
 
 .... 

然后，只需将slidenav抬高一些即可进行补偿。 你甚至可以完全隐藏div，直到你想要点击show按钮。

 $(document).ready(function() { $('#slidenav').animate({ marginTop: '-480px' }, 200); $('#open a').toggle( function(){ $('#slidenav').animate({ marginTop: '0' }, 500); }, function(){ $('#slidenav').animate({ marginTop: '-380px' }, 500); }); });