It’s simply a matter of checking the height prior to resizing. If you would like to eliminate scrollbar flicker consider setting overlflow-y to hidden until 300:
function resize () {
var height = text.scrollHeight <= 300 ? text.scrollHeight : 300;
text.style.height = height+'px';
}
fiddle – http://jsfiddle.net/vtr8kvkx/2/
1
solved Maximum height of textarea to 300px (Javascript)