Ever wondered how sites such as Facebook create that cool auto-grow, auto-height type thing on textarea’s? Where you begin typing and the textarea automatically adjusts its own height to accommodate the text you’ve entered so far. Its awesome, and funny enough, I’ve got the same feature on the comments on this blog.
Its done by one simple, awesome jQuery script from this site.
Once downloaded and referenced in your <head> section, lob this code on your site (making sure you reference your own textarea correctly) and it’ll do its magic…
$(document).ready (function() {
$('textarea.expanding').autogrow({
maxHeight: 100,
minHeight: 30,
lineHeight: 16
});
})
See the demo here. Awesome stuff – respect for the author, not me!





26 Feb 2009 at 10:53 am
good really great
10 Apr 2009 at 6:57 pm
the jquery works fine. But the alignment for this textarea box have error on chrome and safari
23 Aug 2009 at 9:31 pm
Hi,
Nice tutorial.
Btw nice layout too. Especialy that lake at the top.
Regards,
Jacob