javascript - How to prevent textarea from dancing while typing and running into page bottom? : JQuery/CSS -

i continuously typing auto sizing textarea;

when text goes runs bottom of page , continue typing;

what find page dancing hell on each keypress or keyup , text runs bottom of page (for need scroll down check happening). how prevent page dancing , text running bottom?

js fiddle: https://jsfiddle.net/osbnnbxa/

browser: ie10 (also find little dancing in firefox; client use ie10 need work on only)

html:

<div>  <div>   <br><br> &nbsp;&nbsp;     <textarea class="normal" name="myarea" id="myarea" style="height: 100px; overflow-y: hidden;"></textarea>   </div> </div>  <input type="button" class="butt" value="ehehehhe" /> 

jquery:

var myquery = {   autoheight: function(e) {   $(e).css({   'height': 'auto',   'overflow-y': 'hidden'  }).height(e.scrollheight); }, init: function() { settimeout(function() {   $('textarea').each(function() {     myquery.autoheight(this);   }).on('input', function() {     myquery.autoheight(this);   }); }, 200); $("textarea").keypress(function(e) {    $(".butt").focus();        $(this).focus();     });   }  };  $(myquery.init); 

update: customer says not define maximum height of textarea. let flow text increases.

okay, know said let textarea flow, solution. in fiddle, lets textarea grow close bottom of viewport , stops dancing. it's reasonable compromise. modified fiddle here.

textarea {   max-height: 85vh; }