0

I need to make auto growing textarea. This is what I have: http://jsfiddle.net/EkpVn/1/

CSS:

#contact form textarea {
display: block;
margin: 16px 0 0 0;
padding: 0;
color: #084a94;
font-family: 'Montserrat', sans-serif;
font-size: 20px;
line-height: 22px;
width: 345px;
border: none;
border-bottom: 1px solid #122266;
resize: none;
height: 25px;
}

JS: 

$(function() {
   $('.message_autogrow').autogrow();
});

and the final look with autogrowing should look like this:

image

this is not working for me, how to do it right?

baitas212123
  • 151
  • 1
  • 4
  • 14

2 Answers2

1

I added the library's code in the jsFiddle, and the method call is actually autoGrow(); with upper case G.

$(function() {
   $('#message').autoGrow();
});

http://jsfiddle.net/EkpVn/2/

Hanlet Escaño
  • 17,114
  • 8
  • 52
  • 75
1

Just need to properly include and use the JQuery Autosize plugin, then call it on your element:

$(function() {
   $('.message_autogrow').autosize();
});

Demo JSFiddle here

metadept
  • 7,831
  • 2
  • 18
  • 25
  • thank you, but the I also have a problem with that border-bottom, he should expand in each new line, like in image, how to do that? – baitas212123 Aug 16 '13 at 16:40
  • @baitas212123 [This post](http://stackoverflow.com/questions/9289761/how-can-i-show-lines-in-a-texarea-to-make-it-look-like-notepad) has some good suggestions. I think you might also be able to do it with a pure CSS background if you don't want to use an image. – metadept Aug 16 '13 at 16:48
  • i need to do that with CSS but I don't think its doable with CSS (the background like mine) – baitas212123 Aug 16 '13 at 16:59