SHARE
TWEET

Untitled

a guest Jun 20th, 2019 73 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. <RBCarousel
  2.     animation={true}
  3.     autoplay={this.state.autoplay}
  4.     slideshowSpeed={3000}
  5.     leftIcon={leftIcon}
  6.     rightIcon={rightIcon}
  7.     onSelect={this.onSelect}
  8.     ref={r => (this.slider = r)}
  9.     version={4}
  10.     indicators={false}
  11.     >
  12.     {
  13.      this.state.images.map((image, index) => (
  14.                           <Slide key={index}
  15.                           src={image} />
  16.                           ))
  17.      }
  18. </RBCarousel>
  19.      
  20. <CardGroup>
  21.           {
  22.           FeaturesInfo.map((item, index) => {
  23.                 return <FeatureCard key={index}
  24.                 goToSlide={()=>this.goToSlide(index)}
  25.                 icon={require(`../../../Assets/FeaturesImages/${item.icon}`)}
  26. title={item.title} description={item.description} />
  27.             })
  28.            }
  29. </CardGroup>
  30.      
  31. onSelect = (active, direction) => {
  32.         console.log(`active=${active} && direction=${direction}`);
  33.     };
  34.  
  35.     slideNext = () => {
  36.         this.slider.slideNext();
  37.     };
  38.     slidePrev = () => {
  39.         this.slider.slidePrev();
  40.     };
  41.  
  42.     goToSlide = i => {
  43.         this.slider.goToSlide(i);
  44.     };
  45.      
  46. .FeatureCards:active {
  47.   border-top: 5px solid white;
  48.   background-color: rgba(0, 0, 0, 0.9);
  49. }
  50.      
  51. goToSlide = i => {
  52.     this.slider.goToSlide(i);
  53.     this.setState({ currentSlide: i });
  54. };
  55.  
  56. {
  57.  this.state.images.map((image, index) => (
  58.    <Slide key={index}
  59.      // in your slide check is active is true, and add active class.
  60.      active={index === this.state.currentSlide}
  61.      src={image} />
  62.    ))
  63.  }
RAW Paste Data
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy. OK, I Understand
 
Top