Skrollr的平滑性从数据顶部突破到数据顶部底部

Question

我有一个skrollr动画，它基本上从底部向上滑动H2标签，同时从顶部向下滑动div。当它们的父级位于屏幕顶部时，它们都是固定定位和对齐的，以便在屏幕上水平居中。

当父母位于屏幕顶部时，h2标签居中，右侧div顶部位于屏幕顶部，这很棒，问题是右侧div应该向下滑动当父母的底部到达顶部时，它会淡出屏幕，但它会在没有任何动画的情况下断开并向下移动。

为什么会这样？父母身高与右侧div的身高相同

这是我如何做的示例代码：

<section class="sliderInSection" id="clients">

 <div class="leftSide">
    <h2
        data-anchor-target="#clients"
        data-bottom-top="top: 100%; opacity: 0;"
        data-top="top: 50%; opacity: 1;"
        data-top-bottom="top: -50%; opacity: 0;"
    ><span>Our<br/>Clients</span>
         <div class="arrow"></div>
    </h2>
 </div>

   <div class="rightSide"
    data-anchor-target="#clients"
    data-bottom-top="top: -100%; opacity: 0;"
    data-top="top: 0%; opacity: 1;"
    data-top-bottom="top: 100%; opacity: 0;"
>
           <p>here is content</p>
    </div>


</section>