JSFiddle - React, Tailwind, and code Playground

HTML

<div class="apoparent">
  <div id="aposticky">Я - липкий блок<br><br>Прокрути страницу вниз</div>
</div>

CSS

body {
  height: 2000px;
  background: url(http://365psd.ru/images/backgrounds/bg-light-4869.png);
}

#aposticky {
  box-sizing: border-box;
  margin-top: 300px;
  width: 300px;
  height: 200px;
  text-align: center;
  background: #fda;
  border: 10px solid #dea;
  padding-top: 80px;
}

.apostick {
  position: fixed;
  margin-top: 0px!important;
  z-index: 1;
}

JavaScript

var ae = $('#aposticky');
var ao = ae.offset();

document.onscroll = function() {
  if(ao.bottom <= $(window).scrollTop()) {
    ae.addClass('apostick');
  } else {
    ae.removeClass('apostick');
  };
};