jQuery-向下滚动时会缩小的粘性标头

Question

我想知道当向下滚动页面时如何使粘性标头收缩（带有动画），而当页面向上滚动至顶部时又如何回到正常状态。

我得到了固定的零件，但是当用户向下滚动时，应该如何缩小标题呢？

万分感谢

Answer 1

这应该是您使用jQuery寻找的东西。

$(function(){
  $('#header_nav').data('size','big');
});

$(window).scroll(function(){
  if($(document).scrollTop() > 0)
{
    if($('#header_nav').data('size') == 'big')
    {
        $('#header_nav').data('size','small');
        $('#header_nav').stop().animate({
            height:'40px'
        },600);
    }
}
else
  {
    if($('#header_nav').data('size') == 'small')
      {
        $('#header_nav').data('size','big');
        $('#header_nav').stop().animate({
            height:'100px'
        },600);
      }  
  }
});