Scrollify get each page to animate it

Question

I have to work with the library Scrollify.js which is using jQuery (unfortunately). I need to add class on some div when scrolling on a specific section. I'm trying to get each page in terms of animate divs.

Right know I have an event before and after scrolling on all section but need to be independant/specific on each the section. Here is a JSFiddle demo

$(function() {
  $.scrollify({
    section: ".panel",
    before: function(nextIndex, elements) {
//      alert('before event was sent');
    },
    after: function(index) {
//      alert('after is triggered here');
    }
  });

  $(".scroll,.scroll-btn").click(function(e) {
    e.preventDefault();

    $.scrollify.next();
  });
});

From the github's author, it looks like this but confused me...

 before: function(i,panels) {
            var ref = panels[i].attr("data-section-name");


            panels[i].find(".gallery0,.gallery1,.gallery2").addClass("moved");


            if(ref==="design") {
                $(".features").find(".gallery0,.gallery1,.gallery2").removeClass("moved");
                $(".ios7 .gallery0").css("top",0);
            }
            if(ref==="features") {
                $(".ios7 .content").removeClass("moved");
                initialPosition();
            }
            if(ref==="ios7") {
                $(".ios7 .content").addClass("moved");

                $(".ios7 .gallery0").css("top",0);
            }
        },
        after:function(i,panels) {
            var ref = panels[i].attr("data-section-name");

            if(ref==="home") {
                $(".design").find(".gallery0,.gallery1,.gallery2").removeClass("moved");
            }
        }
    });

Answer 1

You can make use of $.scrollify.current() to select the current scrolled section and add class to it

JsFiddle

if($.scrollify.current().attr('data-section-name')=="configuration")
{
   $.scrollify.current().addClass('config');
}