Superscrollorama - 多种元素的补间

Question

这不应该太复杂，虽然我已经挂了它。我正在使用Superscrollorama，这是一个jQuery插件，用于在元素滚动到浏览器中心时发生动画。

如果我想让两个元素在页面的不同区域到达浏览器中间时都褪色，我需要在JavaScript中创建两个单独的补间。我不能有一个fade元素共享脚本中引用的类。这是因为一旦第一个淡入淡出元素被击中，它就会引发两个动画。这里有一段代码不符合我的要求：

<!--HTML-->
<h2 class="fade-it">Fade It</h2>
<h2 class="fade-it">Fade It again</h2>

<!--JavaScript-->
var controller = $.superscrollorama();
controller.addTween('.fade-it', TweenMax.from( $('.fade-it'), .5, {css:{opacity: 0}}));

jsFiddle。对不起，如果我没有正确解释，那就很难说。其重点是减少代码。任何帮助，将不胜感激！

Answer 1

您的回答就在您的描述中。你是对的：如果没有被触发，你就不能有一个共享一个类的淡入淡出元素。给两个元素分隔id，并使用它们的id创建两个单独的补间，而不是共享类。

Answer 2

使用两个单独的补间。这就是它的工作方式。