AutoTextarea

gistfile1.js

function autoTextArea(element,topElement){
		var sw = 0;
		var inc = 20;
	
		inv_box = $('<div class="invisible_box">').css({
			height : 'auto',
			overflow : 'auto',
			position : 'absolute',
			'line-height' : 'normal',
			top : '0px',
			left : '0px',
			background : '#CCC',
			visibility : 'hidden',
			width : $(element).width() + "px",
			'font-size' : $(element).css("font-size"),
			'font-family' : $(element).css("font-family"),
			'padding-top' : $(element).css("padding-top"),
			'padding-left' : $(element).css("padding-left"),
			'padding-right' : $(element).css("padding-right"),
			'padding-bottom' : '10px',
			'word-wrap':'break-word'
		}).appendTo($('body'));
		
		function text() {
			if(sw == 1)$(inv_box).html("");
			var lines = element.value.split("\n");
			for(var i in lines){
				p = $("<p/>").css({'display':'block'});
				line = lines[i].replace(/\t/g,"[[tab]]");				
				p.html(line + "\u00a0");
				inv_box.append(p);
			}
			$(element).css({'height' : $(inv_box).height() + "px !important"});

			if(topElement != null){
				$(topElement).height(463 - $(element).height());
				topElement.scrollTop = topElement.scrollHeight;
			}
			inc = inc + 20;
			sw = 1;			
		}
		element.onfocus = text;
		element.onkeydown = text;
		element.onkeyup = text;
}