Javascript → Скрипт изменения размера textarea как в Drupal

В Drupal есть полезный jQuery скрипт, который позволяет с помощью мышки изменять размеры textarea:

Вот его немного переделанная версия, которую можно использовать вне друпала:

$(function(){

    $('textarea.resizable').each(function(){

        var textarea = $(this).addClass('textarea-processed'), staticOffset = null;

        $(this).wrap('<div class="resizable-textarea"><span></span></div>')
            .parent().append($('<div class="grippie"></div>').mousedown(startDrag));

        var grippie = $('div.grippie', $(this).parent())[0];
        grippie.style.marginRight = (grippie.offsetWidth - $(this)[0].offsetWidth) +'px';

        function startDrag(e){
            staticOffset = textarea.height() - e.pageY;
            textarea.css('opacity', 0.25);
            $(document).mousemove(performDrag).mouseup(endDrag);
            return false;
        }

        function performDrag(e){
            textarea.height(Math.max(32, staticOffset + e.pageY) + 'px');
            return false;
        }

        function endDrag(e){
            $(document).unbind("mousemove", performDrag).unbind("mouseup", endDrag);
            textarea.css('opacity', 1);
        }

    });

});

CSS:

.grippie
{
    height: 9px;
    overflow: hidden;
    background: #eee url(/images/grippie.png) no-repeat center 2px;
    border: 1px solid #ddd;
    border-top-width: 0;
    cursor: s-resize;
}

Картинка grippie.png.

После загрузки DOM, ко всем textarea с классом resizable будет добавлена плашка для изменения размера.

Пример работы скрипта можно посмотреть в форме комментариев, которая находится ниже.