Scroll protection needed

[BarnabasSzabolcs]

Hi Adam!

Scrolling needs to be prevented when a textarea is clicked.
I have added a textarea to Your demo page with {position: absolute; top: 0; bottom: 0; ... } and found that red areas appear when I tap on the textarea. I have added the following callback to Your demo page and it worked out well:

var scrollTextareaInstead = function(){
  if (window.scrollY>0 && document.activeElement.tagName==='TEXTAREA'){
      document.activeElement.scrollTop += window.scrollY+60;  // it is nice to raise the content a bit more than necessary
      window.scrollTo(0,0);
  }
}
window.addEventListener('scroll', scrollTextareaInstead);

This seems to keep the clicked content within the visible area.

(One issue with my sketch may be that a footer bar would cover the clicked text in the textarea - Safari does not scroll up high enough, and does not scroll at all if the tap is higher than the keyboard's height.
Apple devs seem to have the same problem with Notes, and they just scroll the text into view if the text doesn't scroll high enough.)