0.6.3 • Published 5 years ago

react-swipe-gallery v0.6.3

Weekly downloads
2
License
MIT
Repository
github
Last release
5 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

5 years ago

0.6.2

5 years ago

0.6.1

5 years ago

0.5.8

7 years ago

0.5.7

7 years ago

0.5.6

8 years ago

0.5.5

8 years ago

0.5.4

8 years ago

0.5.3

8 years ago

0.5.2

8 years ago

0.5.1

8 years ago

0.4.0

8 years ago

0.3.1

8 years ago

0.3.0

8 years ago

0.2.0

8 years ago

0.1.0

8 years ago