Comparing variable to array values in $(window).scroll Event

Here's a fiddle:

jsfiddle.net/LsLaeakj/1

var currentOffset = 0;
var sections = $('section').toArray();
var offsets = [];
for (var i = 0; i < sections.length; i++){
 offsets.push($(sections[i]).offset().top);   
}
console.log(offsets);
$(window).scroll(function () {
    currentOffset = $(window).scrollTop();
    console.log(checkOffset());
   $('section').css('background-color', 'white'); $(sections[checkOffset()]).css('background-color', 'red');
});
function checkOffset(){
 for (var i = 0; i < offsets.length; i++){
    if (offsets[i] > currentOffset){
        return i-1;
    }
 }
 return offsets.length
}

It sets the last offset div to have a red background, and logs it to the console. Obviously this can be changed but hopefully it illustrates the functionality you were after.

In the scroll callback you could just loop through each array value and test. Breaking if you find one. This assumes the array is in increasing order as well.

var offset, nextOffset, length = offsets.length;
for (var index = 0; index < length; index++) {
    offset = offsets[index];
    nextOffset = offsets[index + 1];
    if (index == length - 1 && currentOffset >= offset) {
        // if last index don't bother checking next value, trigger event
    }
    else if (currentOffset >= offset && nextOffset && currentOffset < nextOffset) {
        // trigger event
        break;
    }
}

try to rewrite the loop like this:

var offsets = [];
$.each($('section'),function (i,v) {
    offsets.push($(v).offset().top)
});

then inside the scroll event use this:

var prevScroll = offsets[0]!=null ? offsets[0] : 0;
var toTrigger = 0;
$.each(offsets,function(i,v){
    if(i>0 && currentOffset >= prevScroll && currentOffset < v){
        toTrigger = i;
        return true;
    }
    prevScroll = v; 
});
switch(toTrigger){
    case 1: 
        function1();
        break;
    case 2:
        function2();
        break;
    case 3:
        function3();
        break;
}