imkqoq
Last Updated: October 28, 2016
·
16.76K
· moak
Picture of me 8

Resize Textarea to fit Content

When users type and add or remove new lines the textarea re-sizes to fit the same number of lines

$('#content').on( 'change keyup keydown paste cut', 'textarea', function (){
    $(this).height(0).height(this.scrollHeight);
}).find( 'textarea' ).change();

Check dat fiddle
http://jsfiddle.net/C8e4w/1/

Say Thanks
Respond

2 Responses
Add your response

18290
Techygypo 1 normal

Excellent thanks :)
I have tweaked this a little to use it as an extension:

$.fn.extend({
autoresize: function () {
$(this).on('change keyup keydown paste cut', function () {
$(this).height(0).height(this.scrollHeight);
}).change();
}
});

$('#mytextarea').autoresize();

over 1 year ago ·
28267
Glitch

I signed up just tell you thank you for sharing, Mark. It was exactly what I needed. I added #content{overflow:hidden;} to get rid of the quick scroll bar that shows up when it resizes.

over 1 year ago ·