https://github.com/luncher/react-carousel

react carousel component
https://github.com/luncher/react-carousel

carousel carousel-component react react-component

Last synced: 3 months ago
JSON representation

react carousel component

• Host: GitHub
• URL: https://github.com/luncher/react-carousel
• Owner: Luncher
• License: mit
• Created: 2021-09-14T08:57:56.000Z (over 3 years ago)
• Default Branch: main
• Last Pushed: 2021-09-22T16:50:45.000Z (over 3 years ago)
• Last Synced: 2025-01-13T04:41:32.554Z (4 months ago)
• Topics: carousel, carousel-component, react, react-component
• Language: TypeScript
• Homepage:
• Size: 396 KB
• Stars: 2
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

        
# React Carousel

![GitHub](https://img.shields.io/github/license/Luncher/react-carousel?style=for-the-badge)

![npm](https://img.shields.io/npm/v/react-carousel-lite?style=for-the-badge)

![Travis (.com)](https://img.shields.io/travis/com/Luncher/react-carousel?style=for-the-badge)

A tiny React Carousel Component.

## Quick Start

### install

>yarn add react-carousel-lite -S

### import styles

>import 'react-carousel-lite/dist/index.css'

### Usage

```typescript

import Carousel from 'react-carousel-lite'

export function App() {

  return (

    

      // {...content}

    

  )

}

```

## Props

|     Name     |                   Type                   | Default |                    Description                     |

| :----------: | :--------------------------------------: | :-----: | :------------------------------------------------: |

|   autoplay   |                 Boolean                  |  false  | A boolean indicates whether to play automatically  |

| dotPosition  |          left/right/top/bottom           | bottom  |               Carousel dot position                |

|    easing    | CSSProperties['animationTimingFunction'] | linear  |            css animationTimingFunction             |

|    effect    |                slide/fade                |  slide  |                  The effect type                   |

|   interval   |                  Number                  | 2000 ms |       The time interval of the slider change       |

| beforeChange |                 Function                 |  NOOP   | beforeChange will be triggered before slide change |

| afterChange  |                 Function                 |  NOOP   | afterChange will be triggered after slide changed  |

|   children   |                ReactNode                 |    -    |                   Slide content                    |