以平滑的方式更改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]）