react-motion-slider - npm explorer

React Motion Slider

![Dependency Status](https://david-dm.org/souporserious/react-motion-slider)

Slider/Carousel powered by React Motion.

Usage

npm install react-motion-slider --save

bower install react-motion-slider --save

Example Usage

js

      ref="slider"
    currentKey="slide-3" // move to a specific slide by passing its key
    autoHeight={true} // animate slider wrapper
  >
    {this.state.slides.map((slide, i) =>
      slide-${i}} className="slide" />
    )}
  
  
          className="slider__control slider__control--prev"
      onClick={() => this.refs['slider'].prev()}
    >
      Prev
    
          className="slider__control slider__control--next"
      onClick={() => this.refs['slider'].next()}
    >
      Next
    
  


`
Props

$3
Move to a slide by its key.
$3
Move to a slide by its index.
$3
The amount of slides shown in view. Defaults to 1.
$3
The amount of slides to move upon using prev and next methods. Defaults to 1.
$3
Animates the wrapper height to fit the current slide. Defaults to false.
$3
Offsets the slide to align either left (default), center, or right.
$3
Enable touch and/or mouse dragging. Defaults to true.
$3
The amount the user must swipe to advance slides. (sliderWidth * swipeThreshold). Defaults  to 0.5
$3
The amount of time in milliseconds that determines if a swipe was a flick or not.
$3
Accepts a React Motion spring config.
$3
Prop callback fired before slide change.
$3
Prop callback fired after slide change.
Public methods

$3
Moves to the previous slide.
$3
Advances to the next slide.
Running Locally
clone repogit clone git@github.com:souporserious/react-motion-slider.git
move into folder
cd ~/react-motion-slider
install dependencies
npm install
run dev mode
npm run dev
open your browser and visit: http://localhost:8080/`

`React Motion Slider`

![Dependency Status](https://david-dm.org/souporserious/react-motion-slider)

Slider/Carousel powered by React Motion.

!react-motion-slider

`Usage`

npm install react-motion-slider --save

bower install react-motion-slider --save

`Example Usage`


``js

      ref="slider"
    currentKey="slide-3" // move to a specific slide by passing its key
    autoHeight={true} // animate slider wrapper
  >
    {this.state.slides.map((slide, i) =>
      slide-${i}} className="slide" />
    )}
  
  
          className="slider__control slider__control--prev"
      onClick={() => this.refs['slider'].prev()}
    >
      Prev
    
          className="slider__control slider__control--next"
      onClick={() => this.refs['slider'].next()}
    >
      Next
    
  


`
Props

$3
Move to a slide by its key.
$3
Move to a slide by its index.
$3
The amount of slides shown in view. Defaults to 1.
$3
The amount of slides to move upon using prev and next methods. Defaults to 1.
$3
Animates the wrapper height to fit the current slide. Defaults to false.
$3
Offsets the slide to align either left (default), center, or right.
$3
Enable touch and/or mouse dragging. Defaults to true.
$3
The amount the user must swipe to advance slides. (sliderWidth * swipeThreshold). Defaults  to 0.5
$3
The amount of time in milliseconds that determines if a swipe was a flick or not.
$3
Accepts a React Motion spring config.
$3
Prop callback fired before slide change.
$3
Prop callback fired after slide change.
Public methods

$3
Moves to the previous slide.
$3
Advances to the next slide.
Running Locally
clone repogit clone git@github.com:souporserious/react-motion-slider.git
move into folder
cd ~/react-motion-slider
install dependencies
npm install
run dev mode
npm run dev
open your browser and visit: http://localhost:8080/`