Javascript Skrollr背景动画获奖'；t交换

嗨，伙计们，我正试图用skrollr.js（）在我的网站的页脚部分交换两幅图像的背景。由于某种原因，它根本不会滚动。我试图创建一个视差网站，有固定的位置在下面的部分

如图所示：

以下是该零件的标记：

 <div id="starynight" 
                data-bottom-top="opacity: 1; background: !url(images/sunny.jpg); background-size: cover;"
                data--40-top="opacity: 0.5; background: !url(images/night.jpg); background-size: cover;"
                data--50-top="opacity: 0; background: !url(images/night.jpg); background-size: cover;"
                 data--60-top="opacity: 0.5; background: !url(images/night.jpg); background-size: cover;"
                data--70-top="opacity: 1; background: !url(images/night.jpg); background-size: cover;"
                >

                </div>

我这里的问题是，当我滚动我的网站的这一部分时，它应该交换sunny.jpg和night.jpg的图像，同时汽车从右向左移动，而且这个背景图像必须固定在适当的位置。出于某种原因，我的代码不能正常工作。知道哪里出了问题吗

---

请参见我的网站：

背景动画与位置动画或“数字”数据动画不同。你不能仅仅通过淡入淡出的方式将一个背景转换成另一个背景（实际上Firefox可以通过某种方式为过渡设置动画，但不要依赖于此）

你的问题的解决方案是有两个不同的div，一个用于你的夜景，另一个用于你的阳光天空，就在同一位置，一个在另一个上面，阳光下的一个具有更高的z指数。 然后你需要在卷轴上设置动画的是阳光灿烂的天空的不透明度，这使得夜景出现

我还发现，你的卷轴级别不足以完全减弱晴朗天空的不透明度，它以

0.603448

结束

---

希望有帮助，请告诉我这是否有效。

如前所述，背景图像不能设置动画，只能设置背景颜色。所以你必须把两个图像放在彼此的上面，然后像这样淡入顶层-

*未经测试

#starynight wrap{
位置：相对位置；
宽度：100%；高度：307px；
}
#星夜{
位置：相对位置；
宽度：100%；高度：100%；
背景：url（'images/sunny.jpg'）；
背景尺寸：封面；
}
#星夜{
位置：绝对位置；
顶部：0；左侧：0；
宽度：100%；高度：100%；
背景：url（'images/night.jpg'）；
背景尺寸：封面；
}

#starynight{
    background: url('../images/sunny.jpg') no-repeat center;    
    width: 100%;
    height: 307px; 
    background-size: cover;

}


#road{
    background: url('../images/road.jpg') no-repeat center;
    width: 100%;
    height: 145px;
  background-size:cover;

}

#car{
   background: url('../images/car.png') no-repeat center;
  width: 325px;
  height: 125px;
  display: block;
  position: absolute;
  z-index: 9999;
  left: 950px;
  top: 2100px;

}