textarea enlarger

auto size a textarea

by Roberto Apasajja

HTML

autoresize:<br>
<textarea style="overflow:hidden; border:1px dotted gray; padding:5px">test</textarea>
<br><br>
not autoresize:<br>
<textarea id="not">test</textarea>

JavaScript

$.fn.enlargeTextArea = function() {
    return this.each(function() {
        var el = $(this);
        var elH = el.outerHeight();
        el.css({
            overflow: "hidden"
        });

        function manageTextarea() {
            el.css({
                height: elH,
                overflow: "hidden"
            });
            var nH = el.get(0).scrollHeight;
            nH = nH > elH ? nH : elH;
            el.css({
                height: nH,
                overflow: "hidden"
            })
        }

        el.bind("keydown", function() {
            manageTextarea(this);
        }).trigger("keydown");

    })
};

$(function() {
    $("textarea").not("#not").enlargeTextArea()
})