Yapışkan bir başlık sayfayı aşağı doğru kaydırın ve sayfanın en üstüne kaydırılan zaman normal durumuna geri giderken(animasyon) çekmek için nasıl merak ediyorum. Burada clearify için iki örnek:

http://themenectar.com/demo/salient/

http://www.kriesi.at/themes/enfold/

Kısmını sabit yapmak istiyorum, ama nasıl kullanıcı aşağı kaydırır zaman benim başlık küçültmek için ne yapmalıyım?

Bir ton teşekkürler

Burada CSS animasyon jezzipin Çözeltisi çatal

JS:

$(window).on("scroll touchmove", function () {
  $('#header_nav').toggleClass('tiny', $(document).scrollTop() > 0);
});

CSS:

.header {
  width:100%;
  height:100px;
  background: #26b;
  color: #fff;
  position:fixed;
  top:0;
  left:0;
  transition: height 500ms, background 500ms;
}
.header.tiny {
  height:40px;
  background: #aaa;
}

http://jsfiddle.net/sinky/S8Fnq/