Small size
Very small footprint at under 1.2kb gzipped and minified.
JS centric
Uses the requestAnimationFrame API to perform js animations for each transition, allowing to animate any numeric css property.
UMD Support
Distribution files have UMD support, allowing for usage along with RequireJS, webpack or just plain browser import.
Simple to use
Just import the script and make a call to the initialization function!
<div style="width: 100%; padding-bottom: 25%" data-simple-slider>
<img src="https://unsplash.it/640/160?random=1"/>
<img src="https://unsplash.it/640/160?random=2"/>
<img src="https://unsplash.it/640/160?random=3"/>
</div>
<script src="https://rawgit.com/ruyadorno/simple-slider/master/dist/simpleslider.min.js"></script>
<script>
simpleslider.getSlider();
</script>Many options can be used to help you customize your slider. Take a look at all the possible values in the Docs or head to the Examples page to get some inspiration.
Well documented
Extensive documentation on how to customize your slider and control it using an intuitive API.
Tons of ready-to-use examples are also available.
Can I just have an element?
Sure thing! There is an Angular directive and a Web component implementation that just wraps this library into ready-to-use elements for these frameworks. Please visit their specific pages for more info on how to use those.
Free and Open Source
All the code is open source under the MIT license and free for any use.