Author: | eldercarvalho |
---|---|
Views Total: | 26,038 views |
Official Page: | Go to website |
Last Update: | November 22, 2019 |
License: | MIT |
Preview:

Description:
elder-carousel is a standalone JavaScript plugin to create a basic responsive carousel that supports multiple items per slide.
How to use it:
1. Link to the elder-carousel plugin’s files.
<link rel="stylesheet" href="dist/style.css"> <script src="dist/index.min.js"></script>
2. Add as many slides to the carousel container.
<div class="carousel-example"> <div> <div class="box">1</div> </div> <div> <div class="box">2</div> </div> <div> <div class="box">3</div> </div> </div>
3. Initialize the plugin to create a default carousel.
new ElderCarousel('.carousel-example');
4. Specify the number of items to show per slide. Default: 3.
new ElderCarousel('.carousel-example',{ items: 2 });
5. Specify the number of items to slide at a time. Default: 1.
new ElderCarousel('.carousel-example',{ step: 2 });
6. Enable/disable the infinite loop functionality. Default: true.
new ElderCarousel('.carousel-example',{ infinite: false });
7. Enable/disable the autoplay functionality. Default: false.
new ElderCarousel('.carousel-example',{ play: true, playInterval: 3000 });
8. Set the animation speed in milliseconds. Default: 300 (ms).
new ElderCarousel('.carousel-example',{ speed: 500 });
9. Enable/disable the navigation arrows. Default: true.
new ElderCarousel('.carousel-example',{ navs: false });
simple and good to customize