....script type="text/javascript"....
var sceneOptions = {duration: 200, offset: -100};
var elements = $("#tweens h3");
// fade
new ScrollScene(sceneOptions)
.addTo(controller)
.triggerHook("onCenter")
.triggerElement(elements[0])
.setTween(TweenMax.from(elements[0], 1, {autoAlpha: 0}));
// move
new ScrollScene(sceneOptions)
.addTo(controller)
.triggerHook("onCenter")
.triggerElement(elements[1])
.setTween(TweenMax.from(elements[1], 1, {left: "-50%", marginLeft: -200, ease: Back.easeOut}));
// spin
new ScrollScene(sceneOptions)
.offset(200)
.addTo(controller)
.triggerHook("onCenter")
.triggerElement(elements[1]) // use previous element as trigger, as top position changes during spin
.setTween(TweenMax.to(elements[2], 1, {rotation: 360}));
// scale
new ScrollScene(sceneOptions)
.addTo(controller)
.triggerHook("onCenter")
.triggerElement(elements[3])
.setTween(TweenMax.from(elements[3], 1, {scale: 0, ease: Back.easeOut}));
// text properties
$(elements[4]).wrapEach(/(.)/g, "$1");// wrap letters
new ScrollScene(sceneOptions)
.addTo(controller)
.triggerHook("onCenter")
.triggerElement(elements[4])
.setTween(TweenMax.staggerTo($(elements[4]).children("span"), 0.0001, {textDecoration: "underline", textTransform: "uppercase"}, 0.2));
//mehrere Tweenings, siehe Beispiel Parallax
var tween = new TimelineMax ()
.add([
TweenMax.to("#parallaxContainer .layer1", 1, {backgroundPosition: "-40% 0", ease: Linear.easeNone}),
TweenMax.to("#parallaxContainer .layer2", 1, {backgroundPosition: "-500% 0", ease: Linear.easeNone}),
TweenMax.to("#parallaxContainer .layer3", 1, {backgroundPosition: "-225% 0", ease: Linear.easeNone})
]);
...script...