Html 按住div直到动画完成

Html 按住div直到动画完成,html,css,animation,skrollr,Html,Css,Animation,Skrollr,我正在使用Skrollr插件,我正在尝试创建一个部分,其中右div将被卡住,而左div必须滚动通过各种图像/动画。我怎么能把那个div放在那里 这是插件: 这就是我现在所拥有的,一切都很简单,只是在早期阶段 HTML: 这是你的全部密码吗。我确信你缺少了一些代码块。只有正文标签、脚本链接和其他一些CSS样式。如果有必要,我可以从头开始,所以请不要使用任何其他代码或标记。我真的不知道该怎么做。(我添加了我当前的代码,因为这通常是SO上的用户想要的)。我检查了你提到的链接,它也显示了一些js代码。

我正在使用Skrollr插件,我正在尝试创建一个部分,其中右div将被卡住,而左div必须滚动通过各种图像/动画。我怎么能把那个div放在那里

这是插件:

这就是我现在所拥有的,一切都很简单,只是在早期阶段

HTML:


这是你的全部密码吗。我确信你缺少了一些代码块。只有正文标签、脚本链接和其他一些CSS样式。如果有必要,我可以从头开始,所以请不要使用任何其他代码或标记。我真的不知道该怎么做。(我添加了我当前的代码,因为这通常是SO上的用户想要的)。我检查了你提到的链接,它也显示了一些js代码。。。
<div class="screenheight slide">
  <div class="content">
    <div class="left-col">
      <div data-200="opacity:0; width:10em;" data-800="opacity:1;" class="large-img"><img src="img/schoen.png"></div>
    </div>
    <div class="right-col">
      <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat.</p>
      <p>Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. </p>
    </div>
  </div>
</div>
.content {
  position: absolute;
  left: 0;
  right: 0;
  width: 92%;
  max-width: 78em;
  top: 25%;
  padding: 0 4%;
}

.left-col {
  margin-left: 0%;
  text-align: right;
  width: 49.5%;
  float: left;
  display: block;
}

.left-col img {
  display: block;
  height: auto;
  width: 70%;
  margin: -5em auto 0;
}

.right-col {
  margin-left: 1%;
  width: 49.5%;
  text-align: left;
  float: left;
  display: block;
}

.right-col img {
  display: block;
  height: auto;
  width: 70%;
  margin: -5em auto 0;
}