Autogrow demo page

Demo page for jQuery autogrow plugin, includes examples of various ways to use the autogrow plugin.


See project page for documentation.

Write, paste or drop text into the textareas

Basic example

Markup

<textarea placeholder="Write something here..." class="span3" data-autogrow rows="3"></textarea>

Heavy padding

Markup

<textarea style="padding: 45px;" placeholder="Write something here..." class="span3" data-autogrow rows="3"></textarea>

Medium padding , with border

Markup

<textarea style="padding: 20px; border: 5px solid black;" placeholder="Write something here..." class="span3" data-autogrow rows="3"></textarea>

Scrollbar

Markup

<textarea placeholder="Write something here..." class="span3 scroll" data-autogrow rows="3"></textarea>

Initially hidden

Show

Markup

<textarea style="display: none;" placeholder="Write something here..." class="span3" data-autogrow rows="3"></textarea>

Base CSS

The base css used.

textarea {
    border: none;
    resize: none;
    overflow: hidden;
}

textarea.scroll {
    overflow-y: scroll;
}