如何使用skrollr.js定位元素？

Question

在下面的codepen中，我希望手机能够粘贴到页面上，我希望两个（内容）div可以从底部滚动到顶部然后粘在那里。

我正在使用这个库scrollr.js，但我想要得到我想要的东西。

我希望手机在第二部分修复，滚动内容一，内容二将逐一显示并坚持到顶部。

我在这里有内容代码：

 <div class="explanation" data-300="opacity: 0" data-350="opacity: 1">
  <h2>First Content</h2>
    <p>Play at home, while you eat, while you poop, and while you walk. Actually, better to look at the street while you walk.</p>
    <a class="arrow" href="#anchor2"><i class="icon-sort-down"></i></a>
    </div><!--/ explanation-->
    <div class="explanation2" data-350="opacity: 0" data-400="opacity: 1">
  <h2>Second Content</h2>
    <p>Second Content Second Content.</p>
    <a class="arrow" href="#anchor2"><i class="icon-sort-down"></i></a>
    </div><!--/ explanation-->
  </div>

感谢您的帮助