JSFiddle - React, Tailwind, and code Playground

HTML

<div id="box"></div>
<div id="log"></div>

CSS

body {
    height: 2000px;
}
#box {
    width: 200px;
    height: 200px;
    top: 100px;
    left: 100px;
    background:  #faeade;
    position: absolute;
}
#log {
     width: 200px;
     height: 200px;
     top: 100px;
     left: 300px;
     background: #defaea;
     position: absolute;
     overflow: auto;
}

JavaScript

$(document).ready(function(){
  box =  $("#box");
  log =  $("#log");
  log.append($('<div/>',{text: box.offset().toSource()}));
  box.remove();
  $(document).scrollTop(200);
  box.offset({left: 100, top: 200});
  $('body').append(box);
  log.append($('<div/>',{text: box.offset().toSource()}));
  box.offset({left: 100, top: 100});
  $(document).scrollTop(0);
});