react-slidez
v0.0.31
React Slideshow Component
0/weekUpdated 3 years agoUnpacked: 192.6 KB
Published by Paul Fitzgerald
npm install react-slidezReact Slidez
Customisable React Slideshow component.
Demo
Installation
``
npm install react-slidez --save
$3
| Property | Description | Type | Default |
| -------------- | -------------------------------------------------------------------------------------------------------------------------------------------- | ------- | ---------- |
| showIndex | Show the index of the current slide | Boolean | false |true
| showArrows | Show arrows to navigate through the slides | Boolean | |true
| autoplay | Select whether you want the slideshow to autoplay or not | Boolean | |true
| enableKeyboard | Select whether you want to allow the user change the slides with the keyboard | Boolean | |false
| useDotIndex | Select whether you want the index to be dots or numbers | Boolean | |2000
| slideInterval | Dictate the speed in ms at which the slides change | Integer | |0
| defaultIndex | Choose the index that you wish to start at | Integer | |fade
| slides | The slides you pass into the component. This can be an array of images, or other components which are passed as children. See example below. | Array | No default |
| effect | Choose the animation effect of your slideshow. Options include , left, top, right, bottom, bounce-right, bounce-left | String | 'fade' |height={'50px'}
| height | Choose the height of the slideshow. Example or height={'50%'} | String | '100%' |width={'50px'}
| width | Choose the width of the slideshow. Example or width={'50%'} | String | '100%' |
Usage
`js
const Slideshow = require('react-slidez');
showArrows
autoplay
enableKeyboard
useDotIndex
slideInterval={2000}
defaultIndex={1}
slides={['1.jpg', '2.jpg']}
effect={'fade'}
height={'100%'}
width={'100%'}
/>
`
You can also pass other components to the Slideshow component as children. All the same properties as above are available.
`js
const Slideshow = require("react-slidez");
``
License
Copyright (c) 2017 Paul Fitzgerald