search

FormidableLabs / nuka-carousel

Small, fast, and accessibility-first React carousel library with an easily customizable UI and behavior to fit your brand and site.
https://commerce.nearform.com/open-source/nuka-carousel
Other
3.08k stars 595 forks source link

Is there a way to keep 2 carousels on the same page in sync? #97

Closed minimaldesign closed 8 years ago

minimaldesign commented 8 years ago

I have two carousels on one page, and I need to keep there currentSlide in sync, but I can't use mixins (external requirements). What would be the best way to set the currentSlide of one carousel with the value of the other? (and vice versa…).

I've tried using the afterSlide prop without much success so far… Any pointer in the right direction much appreciated!

bvasko commented 8 years ago

You can do this:

afterSlide(newSlideIndex) {
    this.setState({ slideIndex: newSlideIndex });
    this.refs.carousel2.goToSlide(newSlideIndex);
  }

https://github.com/bvasko/nuka-carousel/tree/sync-two-carousels