以平滑的方式更改Textarea尺寸

Question

我想达到这样的效果：当用户将一个文本区域聚焦在一个表单中时，它会变得更高，在模糊时会达到它的原始大小。 这就是我到目前为止所做的：http://jsfiddle.net/jRYDw/

我的代码：

$('textarea').focus(function(){
    $(this).css('height','80px');
});

$('textarea').blur(function(){
    $(this).css('height','40px');
});

我想做的是让textarea以平滑的方式扩展，这可能吗？

Answer 1

我不得不使用动画功能

$('textarea').focus(function(){
    $(this).animate({height:'80px'});
});

$('textarea').blur(function(){
    $(this).animate({height:'40px'});
});

您可以指定动画的长度，缓动功能以及动画完成时的回调。

  

.animate（properties [，duration] [，easing] [，complete]）

参考 - http://api.jquery.com/animate/

DEMO