JSFiddle - React, Tailwind, and code Playground

by zerolfc

HTML

<div class="container">
  <div class="resize"></div>
 </div>

CSS

body { padding: 0px; margin: 0px; }
.container {
  position: absolute;
  display: block;
  width: 100%;
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  background-color: grey;
}
.resize {
  position: absolute;
  left: 10px;
  top: 10px;
  width: 150px;
  height: 150px;
  background-color: red;
}

JavaScript

$('.resize').resizable({
	resize: function(e,ui){
  	if ( $('.container').height() < ui.size.height + 10 ) {
    	$('.container').scrollTop( $('.container').scrollTop() + 100 );
    }
  }
});