round-carousel-component v1.2.1

Round Carousel

An infinitely scrollable 3D carousel component for the web

Visitor stats

Code stats

Install

First install the component using your preferred package manager:

npm i round-carousel-component

# or

yarn add round-carousel-component

Usage

Then import the component in your application. Here is an example:

The slides (or items) should have the following shape:

import { RoundCarousel, RoundCarouselItem } from 'round-carousel-component';

const node = document.getElementById('carousel');

// Create an array of Carousel Items
const items: RoundCarouselItem[] = Array(20)
	.fill('')
	.map((_, index) => ({
		alt: 'A random Unsplash photo',
		image: `https://picsum.photos/${210 + index}`,
		content: `<div><strong>Round Carousel</strong><span>Slide number ${index + 1}</span></div>`
	}));

new RoundCarousel(node, {
	items
});

Options

The component accepts the following configuration options as props:

LICENSE

MIT