Incorrect Index on unslider.change Event #365

virtualbrown opened this Issue Mar 31, 2016 · 3 comments


None yet

3 participants


When in infinite mode, the index returned in the unslider.change event includes the
two cloned slides.

This means values of -1 and num_slides will be returned.

e.g. For a Slider with 3 slides.

slider.on('unslider.change', function(event, index, slide) {
alert('Slide has been changed to ' + index);

This code will display
'Slide has been changed to -1'
'Slide has been changed to 3'

Neither of those should be valid indices.

of course -1 can be interpreted as the index of the last slide
and 3 can be interpreted as index 0 but it seems buggy to return
those indicies.


jul-05-2016 19-22-48

I'm seeing the same issue, also, the index appears to be counting one too many. I have four slides, yet it seems to think there are five. It iterates as follows:

Hope the gif helps


did you guys get to solve this problem..?
because I have the same issue.

virtualbrown commented Dec 9, 2016 edited


I ended up doing a kind of kludgey workaround where I handle the 'unslider.change' event, correct the index and then invoke my own callback.


 this.slider.on('unslider.change', function(event, index, slide) {

                // Get the number of slides in the slider
                var num_items = self.collection.length;

                // When in infinite mode, the unslider adds two 'cloned' slides, slide 0 and the last slide.
                // These two slides are at index = -1 and index = num_slides.
                // This code checks for those boundaries and adjusts the index accordingly.

                // -1 means we wrapped around (going left) and are logically on the last slide (even though we are on the cloned slide internally to unslider).
                if( index == -1 )
                    index = num_items - 1;

                // num_items means we wrapped around (going right) and are now logically on slide 0.
                if( index == num_items ){
                    index = 0;

                // Invoke my own callback with the corrected index.
                if( self.changeCallback !== undefined ){
                    self.changeCallback(event, index, slide);



Maybe there is a cleaner way of handling this but this is what I ended up going with.

Initially, I tried to make some modifications to the slider code but those ended up having
adverse side effects.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment