Textarea width auto resize

Question

I want to auto resize the textarea width when I write inside it, with a max-width, like this code do for the input. http://jsbin.com/ahaxe it's possible?

maybe using em in your wisth. it represents the width on an M. will not be very precise but it could work. — Louis Loudog Trottier, Oct 31 '12 at 09:53
Duplicate : http://stackoverflow.com/questions/2948230/auto-expand-textarea — Pranav 웃, Oct 31 '12 at 09:54

score 4 · Answer 1 · answered Oct 31 '12 at 10:01

4

have you tried these may be these can help you

http://www.jacklmoore.com/autosize

http://www.technoreply.com/autogrow-textarea-plugin/

answered Oct 31 '12 at 10:01

user1305989 · Accepted Answer · 2012-10-31T10:14:17.103

DEMO : http://jsfiddle.net/buM6M/1/

html:

<textarea id="t1" style='min-width:100px;min-height: 100px'>

</textarea>

 <div id="d1" style='max-width:200px;min-height:20px;display: none'>

</div>

js code :

  $("#t1").live({
keyup: function(e){

    $("#d1").text($(this).val());
    $(this).css("width", $("#d1").css("width"));
    $(this).css("height", $("#d1").css("height"));
}
});

Set the dimensions of the div and textarea as per your requirement .

Milind Anantwar · Answer 3 · 2013-03-05T14:26:34.517

0

use jquery autogrow plugin.

download autogrowtextarea.js and add to script

and add this css in head:

#id_of_textarea
{
height:auto;
width:width_of_textarea_you_want
}


$(function() {
$('#id_of_textarea').autogrow();
});

for avoiding scroll:

$('#id_of_textarea').css('overflow', 'hidden').autogrow()

edited Mar 05 '13 at 14:26

answered Oct 31 '12 at 09:59

Milind Anantwar

81,290
25
94
125

where did you take `autogrow` from? – Rafael Herscovici Mar 05 '13 at 13:35

Textarea width auto resize

3 Answers3