react-3d-carousel-container
v1.1.2
Published
React 3d carousel that not only takes images but takes divs with your coustom styles
Downloads
21
Readme
React 3d carousel 👋
Simple Dropdown component for React, inspired by Giulio Mainardi Demo is available here
🏠 Homepage
Prerequisites
- Node >= 6.0.0
- React >= 10.0.0
Install
npm install --save-dev react-3d-carousel-container
yarn add react-3d-carousel-container
Usage
import Carousel from 'react-3d-carousel-container';
<Carousel bfc={false}>
<div style={{ width: '450px', padding: '30px' }}>
<img
className="img"
src="https://source.unsplash.com/nvzvOPQW0gc/500x500"
alt=""
style={{ display: 'block', width: '100%' }}
/>
</div>
<div style={{ width: '450px', padding: '30px' }}>
<img
className="img"
src="https://source.unsplash.com/lFmuWU0tv4M/500x500"
alt=""
style={{ display: 'block', width: '100%' }}
/>
</div>
<div style={{ width: '450px', padding: '30px' }}>
<img
className="img"
src="https://source.unsplash.com/aJYO8JmVodY/500x500"
alt=""
style={{ display: 'block', width: '100%' }}
/>
</div>
<div style={{ width: '450px', padding: '30px' }}>
<img
className="img"
src="https://source.unsplash.com/aJYO8JmVodY/500x500"
alt=""
style={{ display: 'block', width: '100%' }}
/>
</div>
<div style={{ width: '450px', padding: '30px' }}>
<img
className="img"
src="https://source.unsplash.com/aJYO8JmVodY/500x500"
alt=""
style={{ display: 'block', width: '100%' }}
/>
</div>
</Carousel>
Props
| Prop | description | default | | ----------- | :------------------------------------: | ------: | | bfc | allows you view the back of the images | false | | perspective | user perpective | 1000 | | arrowClass | pass custom classes to the arrows | '' |
Author
👤 Chinoso Jude
🤝 Contributing
Contributions, issues and feature requests are welcome! Create a pull request and it will be reviewed and merged
Show your support
Give a ⭐️ if this project helped you!