响应式网站的Scrollorama

Question

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

我已经在网站上很好地设置了插件，除了我的div是按百分比完成的，并根据窗口大小调整大小，显然它不能很好地与视差插件一起工作。插件绝对定位div，并以像素为单位定义“top”属性。在调整大小时，它不会改变，它会导致div在它们之间有间隙。

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

SO Question

总而言之，我想向div部分添加一个类，并根据屏幕大小/百分比计算必要的css属性。

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

Answer 1

对于最后一点，我也有“未捕获的TypeError:无法读取未定义的属性'pin‘”错误-问题是在我最初的scrollorama调用中，我已经瞄准了我想要动画的块。

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

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