向下滚动时标题会发生变化（jQuery）

TechCrunch 最近重新设计了他们的网站，他们有一个可爱的标题，当你向下滚动时，它会缩小为更薄的品牌版本。

你可以在这里明白我的意思：http://techcrunch.com/ http://techcrunch.com/

我将如何创建这样的东西？有没有教程，如果没有，各位好心人能给我一些从哪里开始的建议吗？ :)

这不是太难，只是一个简单的.scroll() http://api.jquery.com/scroll/事件。 由于面板的放置方式，我似乎无法用小提琴来完成检查了它！。但基本上你所拥有的是div在上面就是position: absolute所以它总是在最上面，然后使用.scroll()

$("body").scroll( function() {
    var top = $(this).scrollTop();
    // if statement to do changes
});

The scrollTop() http://api.jquery.com/scrollTop/方法用于确定多少body已滚动。

根据您想要更改标题 div 的位置，您可以将if声明可以做很多事情。对于您提供的示例，它会类似于

if ( top > 147 )
    // add the TechCrunch div inside the header
else
    // hide the TechCrunch div so that space is transparent and you can see the banner

EDIT

耶！我能够做到这把小提琴 http://jsfiddle.net/KEjfe/来演示这个例子！ :)

祝你好运！