change a div height with smooth effect

change a div height with smooth effect

Hello,

I have to change a div height, when I click a button. At the moment, I use this code :
  1. $('#map-trigger').click(function() {
  2.       if( $('#map-container').hasClass('closed') ) {
  3.             $('#map-container').css('height', '581px');
  4.       }
  5.       else {
  6.             $('#map-container').css('height', '294px');
  7.       }
  8. });
This works. But the height is "instantly" updated. I'd like this effect to be smoother : The height should "slide" from 294px to 581px. Is that possible ?