Can't scroll to the last items on the right when slidesToScroll={3}

[gkrinc]

When I have a carousel with 9 slides and the following settings, I can't seem to scroll to the last 2 items on the right. I get the elastic effect and the highest currentSlide will go is 6. If I set slideIndex to 8 in the settings currentSlide is 8 and I can scroll to 7, then 6, but once I'm at 6 I can't go back to 7 or 8.

var settings = {
       slidesToShow: 3,
       slidesToScroll: 1,
       cellAlign: 'center',
       cellSpacing: 0,
       slideWidth: 1,
       easing: 'easeInOut',
       decorators: null,
       slideIndex: 2
};

If I change the slidesToShow to 1 I can get to all of the slides; currentSlide will go up to 8.

Here's the state when currentSlide is 0 and 6

Using v1.2.1

[kenwheeler]

Can you try with master?

[gkrinc]

Still not working on master (2.0.1) and I ended up with a few other visual bugs

[gkrinc]

@kenwheeler, can you point me to a spot in the code where I could debug in my setup? I assume it has something to do with a bounds calculation of the last slide index or something along those lines.

[mouhsinelonly]

+1 does not drag to last item when slidesToShow is 3

[awhitehouse104]

It seems to be a problem with any number other than 1 (and no wrap around), not just 3

[awhitehouse104]

Fixed this in pr #110 if anyone needs it

[gkrinc]

Definitely related to slidesToShow > 1 and cellAlign = 'center' in my case.

[ACPrice]

@kenwheeler Is this likely to be merged soon? I'm encountering this issue.

[mdaxtman]

fixed with PR #159

[gkrinc]

Not sure what happened with the merge for 2.0.3, but the problem persists. PR #159 had helped a bit, letting me at least scroll to (center) the 8th of 9 slides, but now I'm back to the problem of only being able to scroll to (center) the 7th of 9 slides. I tried scrollMode 'page' and 'reminder'.

Gotta stick with my fork for now: https://github.com/gkrinc/nuka-carousel

[mdaxtman]

@gkrinc sorry for the inconvenience, we haven't bumped the version for npm yet. We're going to work out a few more bugs before we do that. As a result, npm is still downloading a release from August. However, the changes that were merged into master seem to be working fine for me locally when I replicate your settings and number of children. Let me know if this looks right for your use case--

return (
      <div>
        <Carousel
          slidesToShow={3}
          slidesToScroll={1}
          cellAlign='center'
          scrollMode='page'
          ref="carousel"
          data={this.setCarouselData.bind(this, 'carousel')}
          slideIndex={this.state.slideIndex}
          afterSlide={newSlideIndex => this.setState({ slideIndex: newSlideIndex })}>
          <img src="http://placehold.it/1000x400&text=slide1"/>
          <img src="http://placehold.it/1000x400&text=slide2"/>
          <img src="http://placehold.it/1000x400&text=slide3"/>
          <img src="http://placehold.it/1000x400&text=slide4"/>
          <img src="http://placehold.it/1000x400&text=slide5"/>
          <img src="http://placehold.it/1000x400&text=slide6"/>
          <img src="http://placehold.it/1000x400&text=slide7"/>
          <img src="http://placehold.it/1000x400&text=slide8"/>
          <img src="http://placehold.it/1000x400&text=slide9"/>
        </Carousel>
      </div>
    )

with those settings I get this--

Regardless of whether we get this figured out for you, due to the npm versioning it may be best to stick with your fork for now, unless you want to hardcode the nuka-carousel master branch in your package.json (probably not recommended).

[gkrinc]

Thanks @mdaxtman. Got an idea when the next version will be released?

[mdaxtman]

@gkrinc. No problem. I'm not sure, but soon. Sometime next week would be my guess.