Minimal Flexible Image Carousel - jQuery Neat Slider
File Size: | 87.5 KB |
---|---|
Views Total: | 1461 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |

Neat Slider is a minimal (less than 1kb), flexible, responsive slider jQuery plugin that enables you to switch between images just like a carousel.
How to use it:
1. Include the Neat Slider plugin after jQuery library.
<script src="/path/to/jquery.slim.min.js"></script> <link rel="stylesheet" href="/path/to/neat-slider.css"> <script src="/path/to/neat-slider.js"></script>
2. Include the Linearicons which will be used for next and previous controler icons.
<link rel="stylesheet" href="/path/to/icon-font.min.css">
3. Add your own images together with the navigation & pagination controls to the slider. That's it.
<div class="neat-slider"> <!-- Previous image arrow --> <span class="[ lnr lnr-chevron-left-circle ] arrow" id="prev" alt="Previous"></span> <!-- Image container --> <div class="ns-image-container"> <img src="https://source.unsplash.com/700x506/?yoga"> <img src="https://source.unsplash.com/700x506/?fitness""> <img src="https://source.unsplash.com/700x506/?holiday""> <img src="https://source.unsplash.com/700x506/?cat""> <img src="https://source.unsplash.com/700x506/?girl""> <img src="https://source.unsplash.com/700x506/?sports""> </div> <!-- Next image arrow --> <span class="[ lnr lnr-chevron-right-circle ] arrow" id="next" alt="Next"></span> <!-- Dot navigation --> <div class="dotnav"></div> </div>
This awesome jQuery plugin is developed by maximilian-dybvik. For more Advanced Usages, please check the demo page or visit the official website.