滚动向下时收缩的粘性标题..徽标调整大小

Question

除徽标外，一切正常，同时缩小。滚动时剪切图像。我试图做这样的事情http://www.zulijani.com http://i.imgur.com/HAjLsCs.gif?1 Plz任何想法如何解决这个问题：

HTML

<div class="header">
    <div class="masue">

    </div>

    <div id="nav">
        <ul>
            <li><a href="Index.html"><img src="home.png"> Početna</a></li>
            <li><a href="apartman1.html">Apartman 1 </a></li>
            <li><a href="apartman2.html">Apartman 2</a></li>
            <li><a href="kontakt.html">Kontakt</a></li>
            <li><a href="galerija.html">Galerija</a></li>
            <li><a href="onama.html">O nama</a></li>
        </ul>
    </div>
</div>

CSS

.header {
        background:url(kvadrant1.png);
        opacity:0.7;
        width:100%;
        height:100px;
        margin:0px;
        text-align:left;
        font-family:"Myriad Pro";
        padding-top:0px;
        position: fixed;
        z-index:+1;
     }
.logo {
        position:relative;
        width:300px;
        padding-top:0px;
        margin-left:150px;
        height:100%;
        background:url(logo.png);
      }

的javascript

$('.header,.logo').data('size','big');
});

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