Agregar clase a la página actual usando iScroll - javascript, jquery, iscroll

Como sugiere el título, estoy tratando de agregar una clase al elemento actual "ajustado a". Con esto:

var verticalScroll;
verticalScroll = new IScroll("#wrapper", {
snap: true
});
verticalScroll.on("scrollEnd", function(){
alert(this.currentPage);
});

Recibo esta alerta cuando finaliza el desplazamiento:

[object Object]

Entonces pensé que podría usar algo como esto para agregar una clase:

verticalScroll.on("scrollEnd", function(){
var newPage = this.currentPage;
$(newPage).addClass("current");
});

Pero no hay alegría. Hice muchas búsquedas para tratar de encontrar la misma situación. Debe ser algo bastante simple.

Respuestas

2 para la respuesta № 1

Sí, es un poco complicado. Hace un tiempo intenté agregar una clase "activa" al enlace y la página. Terminé con esto:

después de que finalice el desplazamiento:

myScroll.on("scrollEnd", function () {
addActiveClass();
});

la función:

function addActiveClass() {

// get current page with iScroll
var currentSection = myScroll.currentPage.pageY;

// get current link and page
var activeLink = $("nav a[href="" + currentSection + ""] span");
var activeSection = $("section[class="" + currentSection + ""]");

// remove active class from all links and pages
$("nav a span, section").removeClass("active");

// add active class to current link and page
$(activeLink).addClass("active");
$(activeSection).addClass("active");
}

Solo una cosa que me molesta es que debe asignar a cada sección un número de página como clase:

<section class="0"> … <section>
<section class="1"> … <section>
<section class="2"> … <section>

Lo mismo con los enlaces:

<a href="0"></a>
<a href="1"></a>
<a href="2"></a>

Pero tal vez podría agregarse dinámicamente de alguna manera.

Y no olvide la opción:

snap: "section"

demo jsfiddle

---

0 para la respuesta № 2

    var workCase;

function loadcase() {
workCase = new IScroll("#work-case", {
mouseWheel: true,
resizeScrollbars: true,
snap: "section",
interactiveScrollbars: true,
mouseWheelSpeed: 10,
scrollX: true,
scrollY: false,
momentum: true,
snapSpeed: 800,
scrollbars: "custom",
wheelAction: "scroll"
});

workCase.on("scrollEnd", function() {
var sectionIndex = Number(this.currentPage.pageY);

var iScrollConteiner = $("#work-case").children()[0];
var dataNumber = $(iScrollConteiner)[0].children[sectionIndex].className;

var activeSection = $("section[class="" + dataNumber + ""]");

$("section").removeClass("active");
$(activeSection).addClass("active");

});
}

---