0.1.12 • Published 8 years ago
reaction-carousel v0.1.12
reaction-carousel
A Carousel Component That Build With Pure React
Installation
npm:
npm install reaction-carousel --saveyarn:
yarn add reaction-carousel⚠️ Also you should add style and fonts
@import "~reaction-carousel/lib/reaction-carousel.scss";
Or
@import "~reaction-carousel/lib/reaction-carousel.css";Example
import React, { Component } from 'react';
import Carousel from 'reaction-carousel';
class App extends Component {
render() {
return (
<Carousel>
<img src="https://unsplash.it/1200/310?random" />
<img src="https://unsplash.it/1200/310?random" />
<img src="https://unsplash.it/1200/310?random" />
<img src="https://unsplash.it/1200/310?random" />
<img src="https://unsplash.it/1200/310?random" />
<img src="https://unsplash.it/1200/310?random" />
<img src="https://unsplash.it/1200/310?random" />
</Carousel>
);
}
}| Property | Type | Description | Working |
|---|---|---|---|
| children | array or object | carousel children | Yes |
| transitionTime | number | custom transition time for sliding items | Yes |
| arrows | bool | Should we show Left and right nav arrows | Yes |
| dots | bool | Should we show dots | Yes |
| autoPlay | bool | auto playing | Yes |
| autoplaySpeed | bool | auto playing speed | Yes |
| loop | bool | enable infinite loop | Yes |
| draggable | bool | enable draggable for slides | No |
| slidesToShow | bool | Number of slides to be visible at a time | Yes |