Tweening div position and height?

Tweening div position and height?

Hey guys hoping i could get some help

Ive got a div sitting at the bottom of my page roughly 200px high and i want to have a button that when clicked will tween the height of the div to roughly 600px and also tween the css top property so the bottom of the div stays in the same place and the top just slides to the top of the page.


Is that even possible? haha

This is what I have so far to change the size but not sure how to go about the tween
  $(document).ready(function(){
   
    $("#more").click( function () {
      $("#tabFrame").css({ top:"-260px", height:"616px"});      
     $("#more").css({display:"none"});
     $("#less").css({display:""});
    });


   $("#less").click( function () {
      $("#tabFrame").css({ top:"120px", height:"236px"});      
     $("#more").css({display:""});
     $("#less").css({display:"none"});
    });

  });