javascript - 以平滑的方式更改文本区域大小

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