在大部分滚动后,在屏幕上锁定一个div?

时间:2011-08-27 16:16:00

标签: javascript jquery css html scroll

我目前正试图找到一种方法来锁定我的标题,因为大部分标题已从顶部滚动。

所以,例如,如果我的标题高150像素,那么当用户向下滚动我的页面时,顶部135像素从顶部滚动后,我可以锁定屏幕顶部的底部15像素吗?因此,无论我的页面变成多长时间,我的标题顶部总会有15个像素位于其顶部。

当用户向上滚动时,我还需要将其反转,以便标题可以返回到原始状态。

我已经尝试了一个肮脏的工作,其中另一个标题高15像素,在我的原始标题后面有一个“固定”位置,所以当完整的150像素原始屏幕离开屏幕时,我的新标题从后面出现它。这确实有效,但如果用户在中点捕获它,它看起来很可耻。

我对JavaScript的了解非常有限,而且恐惧可能是我的答案所在。

1 个答案:

答案 0 :(得分:8)

我对你想要的东西感到有些困惑......从你说的话......我觉得你和我做的事情差不多......但是你出于某种原因不喜欢它..

无论如何......如果我找对你,这应该有用。

http://jsfiddle.net/5pJuJ/

基本上有一个元素位于标题后面fixed,顶部是fixed,因此一旦向下滚动就显示出来。


哦,对..如果像渐变之类的东西那么这个效果不是很好......这就是问题吗?

我这样做是为了证明我认为你有问题...... http://jsfiddle.net/5pJuJ/1/(我认为你应该提供...... grr ..)


这看起来就像你想要的那样:

http://imakewebthings.github.com/jquery-waypoints/

http://imakewebthings.github.com/jquery-waypoints/sticky-elements/