如何在javascript中调用函数，然后在滚动事件中调用该函数的特定实例？

Question

I want to run a function (scrollSprite) that on load runs through a for loop, "populating" itself with a bunch of if statements. Then later on a scroll event I want to call this now specific "populated" or "built" function. I know how to call a function on scroll, my problem is specifically that I don't know how to call the specific instance of the function.

See code below:

var scrollSprite = function(distance, frames, frameSize, scrollInterval){

                minScroll = 0;
                maxScroll = -scrollInterval;
                for (i = 0; i < frames; i++){
                    if(distance < minScroll && distance >= maxScroll){
                        $('#sprite').css("top", -scrollInterval);
                    }
                    minScroll = maxScroll;
                    maxScroll -= scrollInterval; 
                }
}

window.addEventListener("scroll", function(e){

    if($('#finding-finders').hasClass('active')){

        var scrollTop     = $(window).scrollTop(),
            elementOffset = $('#finding-finders').offset().top;
            distance      = (elementOffset - scrollTop);

        //if the the element has reached the window then run instance of scrollSprite
        if(distance < 0){
            scrollSprite(distance, 10, 300, 20);
        }
    }
}

Any direction would be greatly appreciated! Thank you

Answer 1

You can use an Immediately-Invoked Function Expression (IIFE). See this example:

var scrollFn = (function() {
  // code here to do something immediately

  // return a new function
  return function(event) {
    // code here to run when scrolling
  };

})(); // immediately invoke function

window.addEventListener('scroll', scrollFn);