сделал это так 
<html>
<body>
<style>
body {height:1000px;}
div { width:100px; height:50px; background:#000; position:fixed;}
</style>
<script src="http://code.jquery.com/jquery-1.8.2.min.js"></script>
<div id = "id1"> dfdf </div>
<script>
var doc = $(document);
var i = 0;
doc.scroll(function(){
  if(i>0){ 
     return 
  }
  
  if(doc.scrollTop() == 0){
	 i++;
	 $('#id1').css('opacity','1');
	 $('#id1').stop().animate({height:50},500);
  }else{
     i--;
     $('#id1').css('opacity','0.4');
     $('#id1').stop().animate({height:10},500);	 
  }
});
</script>
</body>
</html>
 не знаю на сколько это правильно , но работает так как хочу)))
 и кто мне обьяснить почему без  stop(); анимация работает не правильно ?