javascript - 响应式网站的Scrollorama视差

我正在一个网站上尝试使用js插件scrollorama-http://johnpolacek.github.io/scrollorama/

我已经在站点上很好地设置了插件，除了我的div按百分比完成并根据窗口大小调整了大小外，显然它与视差插件无法很好地兼容。插件将div绝对定位并给出以像素为单位的“ top”属性。在调整大小时，它不会改变，并且会导致div之间存在间隙。

我在另一个SO问题上发现了一个可能的解决方案，但是当尝试更改以适合我的网站时，它似乎没有任何作用。这是插件js-Pastebin JS

SO Question

总的来说，我想向div部分添加一个类，并具有通过屏幕尺寸/百分比计算出的必要css属性。

我也注意到控制台日志中有一个错误，它可能也会影响事情-Uncaught TypeError：无法读取未定义的属性“ pin”-在313行

最佳答案

最后，我还遇到了“未捕获的TypeError：无法读取未定义的属性'pin'”错误-问题是，在我最初的scrollorama调用中，我已将要动画的块定位到目标。

为了解决这个问题，我添加了一个名为#blocks的父容器来容纳所有单独的块，然后按以下方式调用它：

var scrollorama = $.scrollorama({
    blocks: '#blocks'
});