实际上不滚动的HTML5滚动条

Question

  

我正在制作一个自定义组件，它显示了巨大动态的一部分   内容 经常更改，因此我无法追加和   删除一直到文档。

滚动条， onScrollBegin ， onScrollEnd ， onScrollUpdate 和 scrollTop 和 scrollMax 值 滚动内容功能非常棒。

我不希望滚动条为我滚动内容。我需要获取当前的scrollTop值并在不创建高度的内容div的情况下完成我的工作人员。

您的建议？

$('#scroller').on('scroll', (e) => {

  let offsetY = $('#scroller').scrollTop();
  $('#custom-content').text("current offsetY: " + Math.round(offsetY));
  
});
$(document).ready(function(){
    $('#custom-content').bind('mousewheel', function(e){
        if(e.originalEvent.wheelDelta/120 > 0) {
            let offsetY = $('#scroller').scrollTop()-3;
            $('#scroller')[0].scrollTop=offsetY;
            // $(this).text('scrolling up !');
        }
        else{
            // $(this).text('scrolling down !');
            let offsetY = $('#scroller').scrollTop()+3;
            $('#scroller')[0].scrollTop=offsetY;            
        }
        e.preventDefault();
    });
    

});

.scroll {

    width: 20px;
    height: 200px;
    overflow-y: auto;
    overflow-x: hidden;

    margin: 0 10px;
}

.scroll-content {
    height: 400px;
    -webkitTransform: translate3D(0px, 0px, 0px);

}

#custom-content {
    float:left;
    width:300px;
    height:200px;

    
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

<div>
  <div id='custom-content'>
  I want to change the scroll content here based on scroll offsetY. 
  </div>

  <div id='scroller' class="scroll">
      <div id='scroll-content' class="scroll-content">
      <!-- this is actually what I don't want -->
      </div>
  </div>

</div>