Aumenta altura do textarea conforme texto já digitado.

Olá, por questão de curiosidade eu comecei a tentar faze uma função igual ao do google calendar para que ao ir digitando o texto ou dando "Enters" dentro do textarea ele aumenta-se de tamanho e assim não dar barra de rolagem nunca. Primeiro tentei copiar o codigo do google, porem como todos que já tentaram tla façanha, sabem que é praticamente impossivel a não ser que se copiei todas 1600 e tantas linhas de codigo do .js...

Ok, depois de pensar um pouco comecei a fazer e cheguei ao seguinte resultado:

O codigo parece ser grande mais tirando os comentarios fica "pequeno".

Coloquei o codigo aqui primeiro por que procurei e não achei nada assim na internet toda. Segundo por que concerteza vocês terão ajustes e vão deixar isso rodando belezinha.

A primeira coisa que seria legal seria tirar a propiedade de scrollbar do textarea, isso deve ser facinho só que depois de escrever esse codigo tou sem paciencia por hoje. Até... espero que seja ultil e melhorado.

java script:

//numero do linhas já setadavar niLin = 5//numero inicial de linhas dadas por entersvar niLin_ = 0//Função de resize no textareafunction cText(obj,evtKeyPress) { //puxa o que seria a quantidade de linhas e adiciona a já setada pelos enters... nLin = ((obj.value.length)/30)+niLin_; //puxa o tamanho em pixels que já foi definido no ta cTam = obj.style.height; //faz verificação de tecla pressionada (crossbrowser) if(window.event) { // Internet Explorer nTecla = evtKeyPress.keyCode; } else if(evtKeyPress.which) { // Nestcape / firefox nTecla = evtKeyPress.which; } //se a tecla não for o enter if (nTecla !== 13) { // se o numero de "nLin" ou seja, caracteres digitados, dividido por 30 (uma media de caracteres por linha). for maior que o numero inicial de linhas: if (nLin >= niLin) { //retira o px da propiedade para poder fazer adição matematica cTam = cTam.replace("px","") //tranforma em "numero" cTam = Math.floor(cTam); //faz adição. tamanho segundo a fonte que eu usei. obj.style.height = cTam + 18; //aumenta o numero "inicial" de linhas niLin++; } } else { //se a tecla digitada for enter. //retira o px da propiedade para poder fazer adição matematica cTam = cTam.replace("px","") //tranforma em "numero" cTam = Math.floor(cTam); //faz adição. tamanho segundo a fonte que eu usei. obj.style.height = cTam + 18; //aumenta o numero "inicial" de linhas niLin++; //aumenta o numero colocado por "enters" niLin_++; }}// Por Dirceu (dirceuu@gmail.com)
CSS (para estilo do textarea):

textarea { font-size: 11px; color: #333333; border: 1px solid #BBC5D9; font-family: Arial, Helvetica, sans-serif; padding: 3px;}
HTML (o textarea):

<textarea name="textarea" cols="38" onkeypress="cText(this,event);" style="height:74px"></textarea>