Jquery extension-auto height text area

Introduction
1. This textarea is like the Google Calendar's description when you create one new or update one existence calendar;
2. Its height will be changed accroding to user's input;
3. Its scrollbar is removed, which makes it much user friendly. I guess you may like it.

 

Using the code

1. Import the jquery. js and textarea. js
<Script language = "JavaScript" type = "text/JavaScript" src = "JS/jquery. Min. js"> </SCRIPT>
<Script language = "JavaScript" type = "text/JavaScript" src = "JS/textarea. js"> </SCRIPT>

2. Add the following CSS
<Style type = "text/CSS">
. Autoheight {border: 1px solid #666666; width: 300px; Height: 60px; line-Height: 20px; Font: 11px verdana; overflow: hidden ;}
</Style>

3. Add one textare HTML Control
<Textarea class = "autoheight" id = "textarea1"> </textarea>

4. Make it works
<Script language = "JavaScript" type = "text/JavaScript">
$ (Document). Ready (function (){
$ (". Autoheight"). textareaautoheight ();
});
</SCRIPT>

 

 

 

Demo
Please click here to view details