响应网站的Scrollorama Parallax

Question

我正在一个网站上工作，我试图使用js插件scrolllorama - http://johnpolacek.github.io/scrollorama/

我在网站上设置插件很好，除了我的div以百分比完成并根据窗口大小调整大小，显然它与parallax插件不兼容。插件绝对定位div并给出定义'top'属性（以像素为单位）。调整大小时它不会改变，它会导致div在它们之间有间隙。

我在另一个SO问题上找到了一个可能的解决方案但是当我试图改变为我的网站工作时它似乎什么也没做。这是插件js - Pastebin JS

SO Question

总的来说，我想在div部分添加一个类，并按屏幕大小/百分比计算必要的css属性。

另外我注意到控制台日志中有错误，它可能也会影响一些事情 - 未捕获的TypeError：无法读取未定义的属性'pin' - 在第313行

Answer 1

对于最后一点，我还有“Uncaught TypeError：无法读取属性''未定义的'pin'错误 - 问题是在我原来的scrolllorama调用中我已经定位了我想要动画的块。

为了修复它，我添加了一个名为#blocks的父容器来容纳所有单独的块，然后调用它：

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