Breaking News: Grepper is joining You.com. Read the official announcement!

text box expands as you type

Jealous Jaguar answered on July 10, 2020 Popularity 3/10 Helpfulness 1/10

answer text box expands as you type

text box expands as you type

Comment

(function(){
    var min = 100, max = 300, pad_right = 5, input = document.getElementById('adjinput');

    input.style.width = min+'px';
    input.onkeypress = input.onkeydown = input.onkeyup = function(){
        var input = this;
        setTimeout(function(){
            var tmp = document.createElement('div');
            tmp.style.padding = '0';
            if(getComputedStyle)
                tmp.style.cssText = getComputedStyle(input, null).cssText;
            if(input.currentStyle)
                tmp.style.cssText = input.currentStyle.cssText;
            tmp.style.width = '';
            tmp.style.position = 'absolute';
            tmp.innerHTML = input.value.replace(/&/g, "&")
                                       .replace(/</g, "<")
                                       .replace(/>/g, ">")
                                       .replace(/"/g, """)
                                       .replace(/'/g, "'")
                                       .replace(/ /g, ' ');
            input.parentNode.appendChild(tmp);
            var width = tmp.clientWidth+pad_right+1;
            tmp.parentNode.removeChild(tmp);
            if(min <= width && width <= max)
                input.style.width = width+'px';
        }, 1);
    }
})();

Popularity 3/10 Helpfulness 1/10 Language whatever

Source: stackoverflow.com

Tags: box text whatever

Link to this answer
Share Copy Link