JSFiddle - React, Tailwind, and code Playground

by levchenko_d

HTML

<p>Some text here</p>
<input type="text" value="focus me" onfocus="ensureVisible(this)" />
<p>Some text here</p>
<input type="text" value="select me" onfocus="ensureVisible(this)" />

CSS

input{
  position: fixed;
  bottom: 0;
  left: 0;
}

JavaScript

var scrolling = function(e, c) {
  e.scrollIntoView();
  if (c < 5) setTimeout(scrolling, 300, e, c + 1);
};
var ensureVisible = function(e) {
  setTimeout(scrolling, 300, e, 0);
};