Javascript 滚动文本时在后台显示图像

我创建了一种效果，即在滚动文本时不断显示图像。我有一个问题，如何使它以同样的方式工作，而不是位置：粘性，位置：固定，这样这种效果在ie上工作

var sticky=document.querySelector（'.sticky container'）；
var img=document.querySelector（'.sticky item'）；
window.addEventListener（'scroll'，setSticky）；
函数setSticky（）{
var top=sticky.offsetTop-window.pageYOffset；
如果（顶部=粘滞。偏离视线| |顶部>=0）{
sticky.classList.remove（'sticky'）；
}
};
*{
保证金：0；
}
身体{
宽度：100%；
填充：120VH0；
}
p{
字号：28px；
颜色：#fff；
文本对齐：居中；
利润率：80px0；
}
.粘性物品{
宽度：100%；
高度：100vh；
背景：url(https://www.apple.com/v/iphone-xs/a/images/overview/camera_hero_large.jpg)中心/盖不重复；
}
.sticky-container.sticky.sticky项目{
位置：粘性；
排名：0；
z指数：-1；
}

Lorem ipsum door sit amet，奉献精英。因此，我们认为，这是一种真正的选择
Lorem ipsum door sat amet concertetur adipising elit。A、 在
Lorem ipsum door sat amet concertetur adipising elit。劳丹蒂姆（Velit laudantium）、艾克（esse omnis neque）、艾米特（minima Volupatibus amet）、阿迪皮西（quod odio architecto veniam fuga inventore adipisci）！德莱克特·福吉特·奎斯夸姆·阿德，萨普的面部手术？法定代表人权利解决方案
洛雷姆，伊普苏姆·多洛坐在一位杰出的领袖面前。除分娩时的面部外，其他部位的同侧阴唇在流动性方面的区别应视为复发的必要条件。诺比斯，多洛尔？这是一个发明家，他是一个时间相似的敏锐的建筑设计师，他是一个罪魁祸首吗

编辑：

<div class="sticky-container">

  <p class="anim">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Sint, magni suscipit modi enim assumenda optio tenetur recusandae sed nobis veritatis!</p>
  <p class="anim">Lorem ipsum dolor sit amet consectetur adipisicing elit. A, at.</p>
  <p class="anim">Lorem ipsum dolor sit amet consectetur adipisicing elit. Velit laudantium, esse omnis neque, minima voluptatibus repellendus amet, quod odio architecto veniam fuga inventore adipisci! Delectus fugit quisquam ad, ab facilis at saepe? Soluta delectus consequuntur fuga ipsa quasi dolorem officiis?</p>
  <p>Lorem, ipsum dolor sit amet consectetur adipisicing elit. Cumque dolorum ipsum distinctio ut excepturi facilis laborum, nihil in aliquid assumenda necessitatibus quaerat recusandae. Nobis, dolore? Hic itaque ipsa inventore illo tempora similique perspiciatis architecto rem, nulla dicta error saepe earum ut atque aut aspernatur deserunt doloribus odit ea, a reprehenderit?</p>

  </div>


  .sticky-item {
  background-attachment: fixed;
  background-size: 100%;
  }


Lorem ipsum door sit amet，奉献精英。因此，我们认为，这是一种真正的选择
Lorem ipsum door sat amet concertetur adipising elit。A、 在
Lorem ipsum door sat amet concertetur adipising elit。劳丹蒂姆（Velit laudantium）、艾克（esse omnis neque）、艾米特（minima Volupatibus amet）、阿迪皮西（quod odio architecto veniam fuga inventore adipisci）！德莱克特·福吉特·奎斯夸姆·阿德，萨普的面部手术？法定代表人权利解决方案
洛雷姆，伊普苏姆·多洛坐在一位杰出的领袖面前。除分娩时的面部外，其他部位的同侧阴唇在流动性方面的区别应视为复发的必要条件。诺比斯，多洛尔？这是一个发明家，他是一个时间相似的敏锐的建筑设计师，他是一个罪魁祸首吗

.粘性物品{
背景附件：固定；
背景大小：100%；
}

Dai是正确的，您不需要使用脚本来实现此效果

既然你需要使用
position:sticky
功能，我怀疑这在IE上不费吹灰之力也不会真正使用JS。但我怀疑这是否值得你花时间

但是，如果您对
sticky
的覆盖范围满意，我将完全跳过使用JS，通过CSS解决它：


*{
保证金：0；
}
身体{
宽度：100%；
填充：120VH0；
}
p{
字号：28px；
颜色：#fff；
文本对齐：居中；
利润率：80px0；
}
.粘性物品{
位置：粘性；
排名：0；
z指数：-1；
宽度：100%；
高度：100vh；
背景：url(https://www.apple.com/v/iphone-xs/a/images/overview/camera_hero_large.jpg)中心/盖不重复；
}

Lorem ipsum door sit amet，奉献精英。因此，我们认为，这是一种真正的选择
Lorem ipsum door sat amet concertetur adipising elit。A、 在
Lorem ipsum door sat amet concertetur adipising elit。劳丹蒂姆（Velit laudantium）、艾克（esse omnis neque）、艾米特（minima Volupatibus amet）、阿迪皮西（quod odio architecto veniam fuga inventore adipisci）！德莱克特·福吉特·奎斯夸姆·阿德，萨普的面部手术？法定代表人权利解决方案
洛雷姆，伊普苏姆·多洛坐在一位杰出的领袖面前。除分娩时的面部外，其他部位的同侧阴唇在流动性方面的区别应视为复发的必要条件。诺比斯，多洛尔？这是一个发明家，他是一个时间相似的敏锐的建筑设计师，他是一个罪魁祸首吗

您根本不需要任何脚本-只需使用
背景位置：固定。看起来与我现在拥有的不同。我希望它看起来一样。这个效果看起来不一样，图片上没有文本。看起来仍然不一样。你有没有一个你想要实现的示例？是否希望图像与顶部齐平。请给出建议。问题中有一个示例，您可以检查代码的作用；）