如何在网站上以多种速率滚动图层

Question

我发现这个网站的效果我想复制。要了解我正在谈论的内容，请转到此处：

http://www.rowtothepole.com/

在网页上，您可以看到冰山层的滚动速度与其顶部的文本框不同。我想知道他们是如何做到这一点的。

Answer 1

在他们的 http://www.rowtothepole.com/release/includes/js/parallax .js

有代码可以移动主体的背景图像和外部 div 的背景图像，分别用于冰山和云：

Event.observe(window, "scroll", function() {
    var offset = document.viewport.getScrollOffsets();

    $(document.body).setStyle({
      'backgroundPosition': 'center -' + (offset[1] / px_scroll_amt) + 'px'
    });

    if (xhr_support) {
        $("outer").setStyle({
          'backgroundPosition': 'center -' + (offset[1] / (px_scroll_amt / 3)) + 'px'
        });
    }
});