2011-08-27 154 views
2

我目前正试图找到一种方法来锁定我的标题在屏幕上大部分已滚动顶部后。因此,如果例如我的标题为150像素高,那么无论如何,在用户向下滚动我的页面时,我可以锁定顶部135像素滚动顶部之后屏幕顶部的底部15像素?所以无论我的网页多长时间,总是会有顶部15个像素的头像。在屏幕滚动过多之后,在屏幕上锁定div?

我还需要在用户滚动备份时反转此操作,以便标题可以返回到原始状态。

我已经试过了一个肮脏的工作,从而有另一个头15像素高与一个“固定”位置分层后面我的原始标题,以便当完整的150像素原始的一个熄灭屏幕我的新的一个出现在它后面。这确实有效,但如果用户在中点捕捉它,它看起来很可耻。

我对JavaScript和恐惧的知识非常有限,可能是我的答案在哪里。

回答

8

我你想要什么..和有点困惑什么youre说..我认为你做的是同一件事,因为我做了..但你不喜欢它由于某种原因..

总之。如果我知道你是对的,这应该是有效的。

http://jsfiddle.net/5pJuJ/

本质上存在被定位fixed其为头之后元素,它是fixed在顶部,一旦你向下滚动因此显露。


噢,没错..如果这些东西像渐变或其他东西一样工作得很好..是这个问题吗?

我这样做是为了证明,我以为你在遇到的问题.. http://jsfiddle.net/5pJuJ/1/(我想你shouldve提供... GRR ..)


这似乎是它是你想要漂亮的正是好:

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

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

+0

是啊,我的头实际上是一个形象,阴影和transparen和它上面的文字。所以,如果你可以想象它从页面底部滚动出来,并且底层的重复头部从下面出来,它不是很漂亮。 我希望能够实现某些目标,其中一个标题div是停止滚动并锁定到位的方式,而不是您描述的方法(我原先使用的方法),因为在这种情况下它看起来非常糟糕。 – Flickdraw

+0

我的js不够强大,无法对此进行任何说明。尽管我认为这可能有点麻烦。 – Joonas

+1

@Flickdraw检查我的更新答案。 (底部) – Joonas