• View our reviews on Hot Scripts
  • JS Tutorial

Recent Comments

Powered by Disqus

Back to articles

Expand textareas to fit content

Texpand class provides a way to expand textareas to fit it's contents. It is possible to provide minimal or maximal values to restrict possible textarea dimensions

Package contains texpand.js, texpand.packed.js (packed javascript) and three example files: simple_example.html, customized.html, and max_dimensions.html to demonstrate class functionality.



Example codes

<!DOCTYPE html>
<textarea id='expand'></textarea>
<script type="text/javascript" src="./texpand.packed.js" ></script>
<script type="text/javascript">
var te = new texpand("expand");

Live Examples

This textarea will expand, when you'll write something in it

Examples in action

Example scripts provided with package in action:

Method list


Back to method list

Method namenew texpand(id, config);
DescriptionCreate expandable textarea
Input parameters

string or HTML element id - id of textarea or textarea element itself

json config - Json structure with configuration properties

  • int minWidth - minimal width of textarea (default: 100)
  • int maxWidth - maximal width of textarea (default: "auto" - means unlimited)
  • int minHeight - minimal height of textarea (default: 30)
  • int maxHeight - maximal height of textarea (default: "auto" - means unlimited)
Example input
var ta = new texpand("expandable", 
	minWidth: 100,
	maxWidth: "auto",
	minHeight: 30,
	maxHeight: "auto"

Latest changes

None for now

You may also be interested in:

Powered by

blog comments powered by Disqus