使用scrollmagic对1类进行多次动画处理

Question

我有一堂课，叫做“红色立方体”。目标是每当此类出现在页面上时，它都应该进行动画处理。现在，它只为头等舱动画。如果向下滚动更多，则第二个类别不会设置动画。

codepen-https://codepen.io/pizzapgh/pen/LJVGaj

这是Javacript

var controller = new ScrollMagic.Controller();

var scene = new ScrollMagic.Scene({
triggerElement: '.red-cube' 
})
 .setClassToggle('.red-cube', 'show')
.addTo(controller);

// whenever a callout block shows, animate