如何在jquery中链接分页和pagesscroll

我在javascript中创建了一个carousel，通过使用页面滚动或单击按钮来显示多个内容。为此我使用了viewpager.js。我在底部添加了一个分页，当单击按钮时可以正常工作。我不知道如何将它链接到页面滚动。任何帮助都是感激的。我的代码:

<div id='prev'>
        <button id="btn-prev"><img src='img/orange-towards-left.png'></button>
    </div>
    <div class='pager'>
        <div class='pager_items' id='info'>              
         </div>
    </div>
    <div id='next'>
      <button id="btn-next"><img src='img/orange-towards-right.png'></button>
      </div>
      <div id='pagination'>
       <ul></ul>
      </div>

JS

item_container = document.querySelector('.pager_items');
   view_pager_elem = document.querySelector('.pager');
   w = view_pager_elem.getBoundingClientRect().width;
   items = payerAccArr.length;
   item_container.style.width = (items * 100)+ '%';
   var child_width = (100 / items) + '%';
   var html = "";
   document.getElementById('monthInfo').innerHTML=payerAccArr[0].DateKey + " Bill Amount ";
   for (var i = 0; i < items; i++) {
     html += "<div class=toggle><h4>Payer Account Name</h4> <ul> <li>" + payerAccArr[i].PayerAccountName + 
    "</li></ul> _______________ <ul><li> "+(payerAccArr[i].TotalAmount).toFixed(2) +
    "   USD</li> </ul></div>";
    }
    item_container.innerHTML = html;
    for(var i=0;i<items;i++)
      item_container.children[i].style.width = child_width;
    var htmlStr='<li class="current"></li>';
    for(var i=0;i<items-1;i++){
       htmlStr += '<li></li>';
    }
    $('#pagination ul').html(htmlStr);
    vp = new ViewPager(view_pager_elem, {
      pages: item_container.children.length,
      vertical: false,
      onPageScroll : function (scrollInfo) {
        offset = -scrollInfo.totalOffset;
        invalidateScroll();
      },
      onPageChange : function (page) {
    document.getElementById('monthInfo').innerHTML=payerAccArr[page].DateKey + " Bill Amount ";
     }
     });
     window.addEventListener('resize', function () {
       w = view_pager_elem.getBoundingClientRect().width;
       invalidateScroll();
     });
     document.getElementById('btn-prev').addEventListener('click', function (){
     vp.previous();
      if(index>0){
       createDoughnutChart(index--);
     }
     var li = jQuery("li.current");
     if (li.length){
       var $prev = li.prev();
       if($prev.length == 0) 
         $prev = $("#pagination li").last().addClass("current");    
        li.removeClass("current");
        $prev.addClass("current");
      }
    });

next按钮也有类似的代码。