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

使用兩個單獨的補間。這就是它的工作原理。