aumentar ancho de un input conforme metemos caracteres en el

[Alexis88]

Trabaja con el evento keyup para que cuando insertes o elimines caracteres, vayas aumentando píxeles al ancho del elemento.

Un ejemplo:

Código Javascript:

document.querySelector("#el id").addEventListener("keyup", function(event){
    //Si hay más de 24 caracteres y no se pulsó la tecla de borrado (backspace)
    if (this.value.length > 24 && event.keyCode != 8){
        //Aumento 7.75 píxeles al ancho de la caja
        this.style.width = parseInt(getComputedStyle(this).width) + 7.75 + "px";
    }
 
    //Si hay más de 24 caracteres y se pulsó la tecla de borrado (backspace)
    if (this.value.length > 24 && event.keyCode == 8){
        //Disminuyo 7.75 píxeles al ancho de la caja
        this.style.width = parseInt(getComputedStyle(this).width) - 7.75 + "px";
    }
}, false);
 

Saludos