Active class with pages bar

[questionablequestion]

Hello,

I'm using pagesBar with pageBuilder but when I change slides with them, it doesn't add active class on active slide.

...
pagesBar: $(".slides-bullets"),
activatePageOn: 'click',
pageBuilder: function (index) {
     return '<a href="javascript:void(null);">'+ index +'</a>';
},
...

Am I doing something wrong? I can think some workaround but I would like to know why this isn't working...

Thanks!

[darsain]

No idea. Isolate the issue on jsfiddle or similar service.

[questionablequestion]

I see that even now on mouse drag it doesn't change class to active to slide that should have class. It's adding class only if you click on slide (you can see trough inspector or click on slide and move slides).

Here is jsfiddle: https://jsfiddle.net/kn3gq695/

Thanks

[darsain]

That's because pages bar will slide Sly to pages (the size of one page is equal to size of frame in Sly's direction, in your case, it's the same as the size of one item). It doesn't activate items... how would that even work in situation where you can see more than one item in a frame?

But, your use case can be accomplished by using forceCentered navigation, along with activateMiddle option:

https://jsfiddle.net/kn3gq695/1/

[questionablequestion]

Thank you very much!