Пытаясь выучить Scrollorama

Question

Я пытался выучить скроллораму на выходных, в прошлом я пытался выучить и использовать множество плагинов jquery, никогда не сталкивался с какими-либо проблемами. Однако этот действительно меня сильно смущает.

Я искал stackru и другие веб-сайты о руководствах по суперскроллорамам, однако ни один из них не указывает точный способ сделать это.

Я сделал скрипку здесь для этой цели.

http://jsfiddle.net/4o46jdj7/1/

Вот что я пытаюсь сделать. Красный div должен закрепиться, затем #text-1 должен прокрутиться вверх и исчезнуть, после того, как он исчезнет, ​​нижний текст должен прокрутиться вверх и после завершения он должен открепиться и перейти к нижнему колонтитулу.

Вот код, который я использую

var controller = jQuery.superscrollorama({
    triggerAtCenter: false,
    playoutAnimations: true
});

var pinAnimations = new TimelineLite();
pinAnimations
    .append(TweenMax.from(jQuery('#text-1'), .5, {css:{marginTop:'300px'}, ease: Quad.easeInOut}))
    .append(TweenMax.to(jQuery('#text-1'), .5, {css:{opacity: 1}}))
    .append(TweenMax.to(jQuery('#text-2'), .5, {css:{bottom:'30px'}}));

    controller.pin(jQuery('#member'), 600, {
        anim:pinAnimations
    });