JSFiddle - React, Tailwind, and code Playground

by duopixel

HTML

<div id="testframe" style="height: 400px; overflow: hidden">
  <div id="innerFrame"></div>
</div>

JavaScript

$(document).ready(function() {
  for(var i=0; i<9999; i++) {
    $('#innerFrame').append('<div style="margin: 9px; background-color: blue; height: 9999px"></div>')
  }
    $('#innerFrame').append('<div>Hi '+ (i==9998) ? "last" : Math.random()+'</div>')

  useTransforms = false
  if(!useTransforms) {
    $('#innerFrame').css({
      'position': 'relative',
      'top': '-100069900px'
    })
  } else {
    $('#innerFrame')[0].style.webkitTransitionProperty = '-webkit-transform'
    $('#innerFrame')[0].style.webkitTransitionDuration = "2000ms"
    $('#innerFrame')[0].style.webkitTransform = "translate3d(0px,-100069900px,0)"
  }
});