1.0.25 • Published 5 years ago

react-carousel-liron v1.0.25

Weekly downloads
1
License
ISC
Repository
-
Last release
5 years ago

React Carousel Liron

A responsive carousel for react that is very easy to use. Comes with a simple fading animation between slides. You can also have auto cycling between slides by adding some props.

Features

  • Responsive
  • Mobile friendly
  • Custom auto play interval
  • Stop play when mouse inside carousel and continue auto play when mouse outside the carousel
  • Infinite loop
  • Supports images , text content or anything you want.
  • Each direct child represents one slide.
  • Supports previuos/next
  • Custom active slide

Installing as a package

npm i react-carousel-liron --save

Usage

import React, { Component } from 'react';
import ReactDOM from 'react-dom';   
import Carousel from 'react-carousel-liron';
class DemoCarousel extends Component {
  render() {        
    return (
      <div className="container">
        <Carousel>
            <div>
                <img src="assets/someimage1.jpg" />
                <h1>some text 1</h1>
                <p>some paragraph text 1</p>
            </div>
            <div>
                <img src="assets/someimage2.jpg" />
                <h1>some text 2</h1>
                <p>some paragraph text 2</p>
            </div>              
        </Carousel>
      </div>
    );
  }
}
ReactDOM.render(<DemoCarousel />, document.querySelector('.demo-carousel'));

API

Carousel

import Carousel from 'react-carousel-liron'
NameTypeDefaultDescription
timernumbernullThe amount of time to delay between automatically cycling an item. If null, carousel will not automatically cycle
selectedIndexnumber0Controls the current visible slide

Demo

https://codesandbox.io/s/1o5lmx9kjj

1.0.25

5 years ago

1.0.24

5 years ago

1.0.23

5 years ago

1.0.22

5 years ago

1.0.21

5 years ago

1.0.20

5 years ago

1.0.19

5 years ago

1.0.18

5 years ago

1.0.17

5 years ago

1.0.16

5 years ago

1.0.15

5 years ago

1.0.14

5 years ago

1.0.13

5 years ago

1.0.12

5 years ago

1.0.11

5 years ago

1.0.10

5 years ago

1.0.9

5 years ago

1.0.8

5 years ago

1.0.7

5 years ago

1.0.6

5 years ago

1.0.5

5 years ago

1.0.4

5 years ago

1.0.3

5 years ago

1.0.2

5 years ago

1.0.1

5 years ago

1.0.0

5 years ago