title: jquery animate line height - possible?
body: <p>quick question about the the animate property in jquery, Is it possible to animate </p>
  
  <p>I cant figure out how?
  here is my html</p>
  
  <pre><code>&lt;nav&gt;
    &lt;a href=""&gt;Page 1&lt;/a&gt;
    &lt;a href=""&gt;Page 2&lt;/a&gt;
    &lt;a href=""&gt;Page 3&lt;/a&gt;
    &lt;a href=""&gt;Page 4&lt;/a&gt;
    &lt;a href=""&gt;Page 5&lt;/a&gt;
    &lt;a href=""&gt;Page 6&lt;/a&gt;
  &lt;/nav&gt;
  &lt;div style="height:9000px;"&gt;&lt;/div&gt;
  </code></pre>
  
  <p>and javascript:</p>
  
  <pre><code>$(function(){
      $('nav').data('size','big');
  });
  
  $(window).scroll(function(){
      var $nav = $('nav');
      var $a = $('nav &gt; a');
      if ($('body').scrollTop() &gt; 0) {
          if ($nav.data('size') == 'big') {
              $nav.data('size','small').stop().animate({
                  height:'40px',
                  line-height:'40px'
              }, 300);
              $a.data('size','small').stop().animate({
                  height:'20px'
              }, 300);
          }
      } else {
          if ($nav.data('size') == 'small') {
              $nav.data('size','big').stop().animate({
                  height:'100px',
                  line-height:'40px'
              }, 300);
              $a.data('size','big').stop().animate({
                  height:'40px'
              }, 300);
  
  
          }  
      }
  });
  </code></pre>
  
  <p>Also is there a way to get the animation for the nav and the a tags to be in sync.</p>
  
  <p>Thanks</p>
  
  <p>ps sorry if its a really basic question - im new to jquery</p>
  
  <p><a href="http://jsfiddle.net/jamesmstone/c7nLB/32/" rel="nofollow">http://jsfiddle.net/jamesmstone/c7nLB/32/</a></p>