javascript - 用户滚动页面时如何缓慢移动标题？

Question

我想在这个示例网站上实现这个 Header 上使用的效果：

http://anchorage-theme.pixelunion.net/

您会注意到，当您滚动页面时，标题会慢慢向上移动，直到它从视图中消失。我想达到同样的效果。我相信它需要一些 JS 和 CSS 定位，但仍然不知道如何实现这一点。这是通过视差滚动完成的吗？

如果有人能给我一个简单的例子来说明用于对元素执行此操作的代码，将不胜感激。所以我可以在我自己的网站上使用它。

干杯。

Answer 1

$(window).scroll(function () {...}) 是您在这里需要的

$(document).scrollTop() 是从顶部滚动的距离

Answer 2

用这个：

$(window).scroll(function(){ 
  if ($(this).scrollTop() > x){  // x should be from where you want this to happen from top//
    //make CSS changes here
  } 
  else{
    //back to default styles

  }
});