Scrollorama -- 'pin'

Question

I'm trying to implement the 'pin' feature from scrollorama (http://johnpolacek.github.io/scrollorama/) but I'm not sure which parts of the code I use to pull into my own file.

Where do I adjust where on the screen it gets pinned, etc? And how is that directly connected to the '#unpin' and h2 element?

Answer 1

To pin

    controller.pin($('#examples-2'), 3000, {
  anim: (new TimelineLite())
    .append(
      TweenMax.fromTo($('#move-it'), .5, 
        {css:{left: -200, top: 500}, immediateRender:true}, 
        {css:{top: -400}})
    )
    .append(
      TweenMax.to($('#move-it'), .5, 
        {css:{left: 0}})
    )
});

To remove pin

controller.removePin('#examples-2', false);

More detail you can see on super scrollama page http://johnpolacek.github.io/superscrollorama/