div设置overflow-scroll滚动之后，jq获取其子元素的offset.top问题再现（错位）

一、html

    <div class="ce-leftBox">
    //左边的内容
        </div>
    <div class="ce-rightBox">
    //右边的内容            
    </div>
</div>

二、css

  background: white;
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  padding-top: 50px;
}
.ce-container .ce-leftBox {
  float: left;
  width: 90px;
  height: 100%;
  border-right: 1px solid #F8F8F8;
  background: white;
  overflow-y: auto;
  text-align: center;
}
.ce-container .ce-rightBox {
  height: 100%;
  margin-left: 81px;
  overflow-y: auto;
  padding: 0 15px;
}

实现点击左边，右边滚动的思路：

在左边点击列表的时候，获取当前的索引值，然后，右边再通过该索引值，获取到对应部分的offset.top值，然后再设置右边div scrollTop就可以了。但是！！！问题就这样出现了。。。先来看看最初版的js

     $(this).addClass('ce-lActive').siblings().removeClass('ce-lActive');
     var idx=$(this).index();
        
     var sTop=$('.ce-rightBox > .ce-rightItem').eq(idx).offset().top-50;//减50是去除头部返回栏的高度
     $('.ce-rightBox').stop(true).animate({"scrollTop":sTop},400);
})

问题出现：

？？？为什么会错乱？？？当没有设置 $('.ce-rightBox').stop(true).animate({"scrollTop":sTop},400); 这条语句的时候，获取到的sTop值是是正常的，但是加上这句话之后就出现了：点击1，sTop是0；点击2，sTop是321；点击3，sTop还是321？？？

问题分析：

很明显，就是这条语句影响了结果，那为什么呢？难道是div内部滚动之后，会影响子元素获取offset.top的值？

果然，当第一次点击3的时候，右边div滚动了，这时候sTop的值是321，正常的，然后我再次点击3的时候，按道理来讲，sTop应该还是321，但是这时候，显示的结果是0。为什么会出现这种情况呢？

问题解决代码

    $(this).addClass('ce-lActive').siblings().removeClass('ce-lActive');
    var idx=$(this).index();
        
    var sTop=$('.ce-rightBox > .ce-rightItem').eq(idx).offset().top-50;
        
    var nowScrollTop=$('.ce-rightBox').scrollTop();//当前已经滚动了多少
    $('.ce-rightBox').stop(true).animate({"scrollTop":sTop+nowScrollTop},400);
})