Jquery 图像固定内容更改在单个卷轴上

下面是我的代码，我对写jquery代码感到困惑，我的问题是我想在下一个div中添加类active并在向下滚动时从第一个div中删除，当我向上滚动时，相同的过程反过来应用， 请从头到尾附上jquery代码

.main{
高度：1000px；
位置：相对位置；
宽度：100%；
}
.形象{
位置：固定；
最高：0%；
左：0；
高度：500px；
最大宽度：100%；
}
.内容{
位置：绝对位置；
排名：0；
不透明度：0；
}
.主动{
不透明度：1；
}

内容1
内容2

更改图像固定到相对位置的位置

.image{
position:relative;
}

---

我通过在第三个函数中添加一个局部变量修复了这个问题，该函数在用户每次滚动时都会更新

$(document).ready(function(){
   $(window).scroll(function(){
      var currentScreenPosition  = $(document).scrollTop();
      if (currentScreenPosition > divThreeHeight) {
          $( "content" ).addClass( "active" );
      };
   });
});

---

请理解我的问题，然后发表评论