Search code examples
scrollmagic

How to invoke a function at a trigger point?


When a trigger point is reached, I just want to call a function or run a few statements to do something, which has nothing to do with interface. Here is how I am doing now for this purpose:

var scene = new ScrollMagic.Scene({triggerElement: "#some-trigger", triggerHook: 'onLeave', offset: })
   .on('start', function () {

    // statements go here

    }).addTo(controller);

Is this the correct way?

The reason to ask this question is that I find out Scroll Magic can be a UNIQUE event control tool.


Solution

  • Little later but I jump to that question because I had the same issue in some projects.

    So i solved in two ways:

    Using enter or progress event

    ENTER is trigger when a scene is starting. It's depends on triggerHook

    scene.on("enter", function (event) {
       console.log("Scene entered.");
    });
    

    PROGRESS is trigger every time

    scene.on("progress", function (ev) {
        if( ev.progress > 0.25){
           //== going farward
        }
        if(ev.progress < 0.25){
          //== going backward
        }
    })