JSFiddle - React, Tailwind, and code Playground

HTML

<div class="sidebar">
  <h4>Sidebar</h4>
  <a id="scroll" href>Click to scroll</a>
</div>
<div id="top-pos"></div>
<div id="content">
  <button class="btn">Get scroll Top</button>
  <p>
    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vivamus accumsan porta sollicitudin. Duis vitae libero pellentesque, dapibus nunc nec, egestas purus. Sed ultrices at ipsum vel dapibus. Suspendisse potenti. Nulla ligula sem, condimentum ut eleifend
    ut, pharetra a quam. Curabitur sed fringilla velit. Nullam placerat justo sed nisi venenatis aliquet. In odio libero, faucibus sed velit nec, accumsan iaculis justo. Vestibulum vel rhoncus sapien. Fusce a convallis sapien. Pellentesque eu luctus orci.
    Aliquam dictum massa eget nunc feugiat, eu tempor urna feugiat. Proin ornare magna sed magna venenatis, sit amet gravida ipsum ullamcorper. Vivamus sit amet turpis maximus, venenatis metus quis, facilisis felis. Donec maximus, mi vitae tempor tincidunt,
    nibh nulla dapibus tellus, sit amet aliquam eros mi quis odio. Integer sodales elit sodales ante tempus, ac posuere nisi pellentesque.
  </p>
  <p>
    Duis ut porttitor nisl. Fusce laoreet sodales justo, eu consectetur lacus malesuada ut. Etiam tempus leo id est vestibulum, non finibus tortor dignissim. In nunc dui, volutpat at rhoncus ut, sollicitudin vel libero. Nulla eget nisl imperdiet, varius odio
    vel, pellentesque urna. Donec ornare commodo augue, non malesuada tortor eleifend et. Maecenas sollicitudin fringilla ex, ac aliquam lacus mollis vel. Maecenas faucibus hendrerit purus in laoreet. Nulla maximus varius risus eu sagittis. In urna quam,
    iaculis lacinia turpis eu, consectetur congue sapien. Curabitur eget efficitur eros.
  </p>
  <h1 id="test">Scroll to here.</h1>
  <p>
    Sed dictum nulla vitae sapien ornare lacinia. Curabitur eu augue in libero sodales cursus. Sed in consectetur augue. Curabitur vitae sagittis arcu, id malesuada felis. Curabitur efficitur non risus ut placerat. Aliquam commodo...

CSS

body {
  position: absolute;
  left: 0;
  right: 20%;
  top: 0;
  bottom: 0;
  overflow: hidden;
  background: #c0ffee;
  padding: 0;
  margin: 0;
}

html {
  overflow: hidden;
  height: 100%;
}

.sidebar {
  width: 20%;
  position: fixed;
  top: 0;
  bottom: 0;
  right: 0;
  background: #333;
  color: #fff;
  padding: 1em;
  box-sizing: border-box;
}

.sidebar a {
  color: #fff;
}

#top-pos {
  top: 0;
  position: absolute;
  height: 0;
}

#content{
  overflow-y: auto;
  max-height: 100%;
}

JavaScript

$('.btn').on('click', function() {
  console.log($('body').scrollTop());
  console.log($('#top-pos').position().top);
})

$('#scroll').on('click', function(e) {
  e.preventDefault();

  $('#content').scrollTop(400);


})