Skip to content

A slide plugin for react. The main focus was to build an accessible, high-performance and easy-to-install plugin.

License

Notifications You must be signed in to change notification settings

escabora/slider-moon

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

35 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Version Downloads Total License CodeFactor

Slider Moon

A slide plugin for react. The main focus was to build an accessible, high-performance and easy-to-install plugin. Feel free to explore and evolve my plugin. See the examples here

Install

$ npm i slider-moon

or

$ yarn add slider-moon

How to use

import the function Slider and css in your component.

import Slider from 'slider-moon';
import 'slider-moon/dist/style.css'

<Slider
  slideClass={'my-slider'}
  infinite={true}
  bullets={true}
  arrowsNav={true}
  animation={'scale'}
  callback={() => {
    console.log('here');
  }}
>
    <div className='slider my-slider'>
      <ul className='slider-wrapper'>
        {items.map((item) => (
          <li key={item}>
            <img src={yourImage} />
          </li>
        ))}
      </ul>
    </div>
</Slider>

Options

options can be passed as props to the Slider component. See below for the options and their description.

Name type default description
infinite bolean null determines whether the slider will be infinite when reaching the last item.
bullets bolean null enable clickable bullets under the slider.
arrowsNav bolean null enable arrows for slider navigation.
animation string null name of animation for slider transition.
callback func void function that triggers every time the slider is updated (resize and click to change slide).

Contributing

If you have a pull request that you would like to submit, be sure to update the library version. Feel free to help and evolve the plugin.

License

The code is available under the MIT License.

About

A slide plugin for react. The main focus was to build an accessible, high-performance and easy-to-install plugin.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published