Inspired by Jason Frame’s method, I’ve created an animating ‘autoResize’ jQuery plugin. Although it was inspired by his plugin it has a few slight differences, most notably the way in which the off-screen “testing” takes place. In his plugin (apparently inspired by Facebook’s implementation) a DIV is created off-screen and is filled with the textarea’s value whenever it changes. The height of this DIV is retrieved and then applied to the textarea. My plugin makes use of the scrollTop DOM property to gain the true height of the text and then applies that directly (or via animation) to the textarea.
via jQuery plugin: ‘autoResize’ – James Padolsey. Extremely nice jQuery plugin for auto-resizing textareas. The one issue is that on page load the plugin doesn’t calculate the size of the textarea. Reading the jQuery API docs for the Ready event it looks like a normal jQuery object can not be binded to ready, only the jQuery document core object can be.