Swipi

Installation

npm

$ npm install swipi

yarn

$ yarn add swipi

Usage

import Swipi from 'swipi'

const styles = { height: '250px', backgroundColor: '#dadada' }

export const App = () => (
  <Swipi
    loop
    showDots
    spaceBetweenSlides={15}
  >
    <div style={styles} />
    <div style={styles} />
    <div style={styles} />
    <div style={styles} />
    <div style={styles} />
  </Swipi>
)

🔥 View more examples and create a custom slider

Browsers support

| IE / Edge | Firefox | Chrome | Safari | Opera | | --------- | --------- | --------- | --------- | --------- | | IE11, Edge| last 3 versions| last 3 versions| last 3 versions| last 3 versions

Props

💅 Styling

.swipi-wrapper - styles the container that wraps the slider with dots

.swipi-container - styles the container that wraps slides with arrows

.dots-wrapper - styles the container that wraps the dots

.left-button - styles the left button that gets the user to the previous slide

.right-button - styles the right button that gets the user to the next slide