Awesome-carousel-component NPM

awesome carousel component

Component accepts an array of either react elements or an array of react components from as prop children.

Installation

npm

npm install awesome-carousel-component

Example

Example code

import React from 'react';
import Slider from 'awesome-carousel-component';

const SimpleSlider = () => {
  return ({
    <Slider>
      {[
        <div key="1">
          <img />
        </div>,
        <div key="2">
          <img />
        </div>,
        <div key="3">
          <img />
        </div>
      ]}
    </Slider>
  });
};

Props

Prop	Description	Default	Type
children	array of either react elements or an array of react components	!	!
centerSlide	the index of the slide in the array, which is set to the center of the slider	0	number
visualSlidesCount	number of displayed slides per page	3	number
slideMargin	margin to the right and left of each slide	10	number (in px)
duration	duration of slide transition animation	400	number (in ms)
sliderHeight	height for slider	auto	string (in px)
visualPartWidth	width of the slider display window	100%	string (in %, in px, etc.)
slideWidth	width of one slide	auto	number (in px)
inMinSteps	the jump to the desired slide can follow the closest path from the current location through the beginning or end of the array to get fewer steps to the desired slide	false	boolean
isFlipping	do I need buttons to scroll to the right and left on the page	true	boolean
isFlicktyDots	do I need flickity page dots on the page	true	boolean

Prop children is required, others may not be. Props can be changed at any time except for prop children.

@everything-registry/sub-chunk-1191 @infinitebrahmanuniverse/nolb-awe

1.0.0

3 years ago