Auto-Sizing Textareas with jQuery

May 22, 2011 1 min read

Every website that I build ends up being better than the last. Something becomes more efficient, or some new little detail becomes standard. One such detail has been automatically-sizing textareas, similar to Facebook’s. It’s a simple idea: the user types more text, the text area gets bigger. It requires no extra UI, it makes perfect sense as it happens, and it degrades without issue. The jQuery plugin I keep coming back to is James Padolsey’s autoResize.

I’ve also made a habit of having textareas size automatically when the page loads, in the even that there’s already text in the field to be edited:

$('textarea.autosize').autoResize().trigger('change');

Update: since my original link died, you may instead want to check out Jack Moore’s similar jQuery plugin.

***
Matt Stein’s face

by Matt Stein

Full stack tinkerer, sporadic blogger and Craft CMS fan occasionally found on the devMode.fm podcast.