jquery - 网站底部滚动时标题保持不变

Question

我正在尝试实现他们在 google Ventures网站上的效果，用户可以滚动页面底部，同时缓慢显示滑过标题的效果。

知道如何实现吗？

非常感谢。

Answer 1

You can do this by making a section of website position fixed. Its something like this

<div class="sec1"></div> 
<div class="sec2"></div>

.sec1 {
 position: fixed;
....
....
}

Answer 2

尝试这样的事情：

HTML：

<div class="container">
    <div class="header">

    </div>

    <div class="content">

    </div>
</div>

CSS：

div
{
    width: 300px;
}

.container
{
    position: relative;
    height: 1000px;
}

.header
{
    position: fixed;
    top: 0;
    z-index: 999;
    height: 200px;
    background-color: green;
}

.content
{
    position: relative;
    z-index: 1000;
    margin-top: 200px;
    height: 100%;
    background-color: blue;
}

工作副本可以在这里找到：

http://jsfiddle.net/mDP3y/