0.6.3 • Published 7 years ago

react-swipe-gallery v0.6.3

Weekly downloads
2
License
MIT
Repository
github
Last release
7 years ago

React Swipe Gallery Component

Swipe gallery over React

You can view an online example in http://amadormf.github.io/react-swipe-gallery/

##Install

npm install --save react-swipe-gallery

##Example

import SwipeGallery from 'react-swipe-gallery'

//elements only for example
function getElements(numElements) {
  const elements = [];
  for (let i = 0; i < numElements; ++i) {
    elements.push(
      <div className="subelement" key={i}>
        { i }
      </div>
    );
  }
  return elements;
}

//swipe gallery example
const gallery = (
  <SwipeGallery
    elements={getElements(5)}
    maxElement={3}
  />  
);

##Props

Props NameTypeDefaultDescription
elementsArrayElement of gallery
maxElementsNumber1Max number of elements
onChangePositionFunctionCall when change the elements visibles
orientationStringHORIZONTALSwipeGallery.VERTICAL or SwipeGallery.HORIZONTAL
classNameStringCustom name class
bufferBooltrueif is true add a buffer for quickly transition
hideArrowBoolfalseIf is true don't show the arrows
hideArrowWithNoElementsBooltrueIf is true and maxElements > elements.length don't show the arrows
customStylesStringAdd inline styles to component
disableSwipeBoolfalseDisable swipe event
stopPropagationBoolfalseIf is true, call a stopPropagation on touch events'
infinityGalleryBooltrueIf is true the gallery is infinity
arrowObject{ prev: '❮', next: '❯',}Change the arrow, you can send a string or a element
initialPositionNumber0Initial position of gallery
positionNumberChange position of gallery
0.6.3

7 years ago

0.6.2

7 years ago

0.6.1

7 years ago

0.5.8

9 years ago

0.5.7

9 years ago

0.5.6

10 years ago

0.5.5

10 years ago

0.5.4

10 years ago

0.5.3

10 years ago

0.5.2

10 years ago

0.5.1

10 years ago

0.4.0

10 years ago

0.3.1

10 years ago

0.3.0

10 years ago

0.2.0

10 years ago

0.1.0

10 years ago