Superscrollorama - Tweens for multiple elements

Question

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

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

<!--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创建两个单独的补间，而不是共享类。

Answer 2

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