Getting Started : Using AMD

Setting up the Config

When using ScrollMagic make sure the paths to the source files of all dependencies are known.
Usually you may have to define them u sing the requirejs config.

require.config({
    baseUrl: 'js',
    paths: {
        TweenMax: 'lib/greensock/TweenMax',
        TimelineMax: 'lib/greensock/TimelineMax',
        jquery: 'lib/jquery.min',
        ScrollMagic: 'jquery.scrollmagic',
        "ScrollMagic.debug": 'jquery.scrollmagic.debug'
    }
});

Using ScrollMagic with AMD

For AMD only one object is exported containing references to the ScrollMagic controller and the ScrollScene Constructors.
Compared to the browser globals the object looks like this:

{
    Controller: ScrollMagic,
    Scene: ScrollScene
}

To use ScrollMagic in your setup you need to use these references as constructors.
Example:

require('ScrollMagic', 'ScrollMagic.debug'], function(ScrollMagic) {
    // init controller
    var controller = new ScrollMagic.Controller({
            globalSceneOptions: {triggerHook: "onCenter"}
        });
    // init scene
    var scene = new ScrollMagic.Scene({
            duration: 300,
            offset: 100
        })
        .addTo(controller)
        .addIndicators();
});