Question

我为我的新项目Parallax Footer创建了一个视差页脚，但是只要在它上方添加一个div来模拟实际的主页：Parallax Footer w/ Simulated Content，它就会停止运行，我觉得我理解为什么，但我似乎无法弄清楚如何纠正它。这就像我必须在某一点触发视差，但我不知道该怎么做。朝正确方向的任何推动都会非常有帮助。

这是我的js，我是从另一支笔借来的：

  var opThresh = 350;
  var opFactor = 750;

  window.addEventListener("scroll", function (event) {

     var top = this.pageYOffset;

     var layers = document.getElementsByClassName("parallax");
     var layer, speed, yPos;
     for (var i = 0; i < layers.length; i++) {
        layer = layers[i];
        speed = layer.getAttribute('data-speed');
        var yPos = -(top * speed / 100);
        layer.setAttribute('style', 'transform: translate3d(0px, ' + yPos + 'px, 0px)');

     }
  });
}
document.body.onload = castParallax();

Answer 1

如何将#parallax设置为绝对值：

#parallax {
    display: block;
    position: absolute;
    top: 0px;
}

仅在FOOTER中的视差

1 个答案: