Re-Size Textarea

[The Little Guy]

how would I auto size a textarea while the user types?

 

currently I have this, but it doesn't work...

function updateTextBoxHeight(id){
if(id == 'aboutme'){
	var d = document.getElementById("eAbout");
	d.style.height = parseInt(d.style.height) + 12 + 'px';
}
}

 

As the user types it auto re-sizes, but it still does it even if it is not needed. Basically I would like it to work like "Facebook's" method of textarea re-size. The 12 is in there because I want it to have an extra 12 px at the bottom of the textarea.

 

It is triggered by the onkeyup event btw.

[gffg4574fghsDSGDGKJYM]

Why you don't look at facebook javascript to see how they done it ?

[Axeia]

Looks like someone already did it before you and wrote a jquery plugin for it:

http://www.unwrongest.com/projects/elastic/

[The Little Guy]

I would really like it if I didn't use someone elses..

[.josh]

so why can't you look at it to see how they did it? Or were you wanting one of us to write it for you?  So what you're really saying is that you don't mind using someone else's code, as long as they specifically wrote it for you.

[The Little Guy]

Well... I would mostly like to fix my above...

 

If I use this (different than prev):

 

function updateTextBoxHeight(id){
   if(id == 'aboutme'){
      var d = document.getElementById("eAbout");
      d.style.height = d.scrollHeight+'px';
   }
}

 

It works, but when It goes to the next line it shows the scroll bar for a second, then re sizes it, and the scroll bar is gone. I just want to find a way I can fix that so the scroll bar doesn't show up.

[The Little Guy]

I was able to remove the scroll bar by simply adding css "overflow:hidden"