Growing textarea using the jGrow plugin
In
web browsers, the textarea element's height and width are controlled through the rows and cols attributes or through height and width CSS properties. When we enter more text in the textarea, the upper text will move up, leaving a scrollbar. To improve the UI for textarea, some Ajax experts have made the textarea grow when more text is entered. In this recipe, we'll see how to use the jGrow plugin to get such a growing textarea.
Getting ready
We'll require the jGrow jQuery plugin from http://lab.berkerpeksag.com/jGrow along with the jQuery core library.
How to do it...
Here, we have used a simple textarea with an id set, so that it can easily be hooked with jQuery selector.
Here's the HTML markup:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<script type="text/javascript" src="js/jquery.js"></script>
...
