The “silder” is a thin and basic jQuery plugin that allows you to create animated image slider. You just need to place your images in slider’s HTML structure. After that, this plugin render a beautiful fullscreen animated image slider with next previous buttons. Moreover, it can be also customized with additional CSS according to your needs.
Plugin Overview and Preview
|Published:||November 15, 2019|
|Package Size:||5 MB|
|Dependencies:||jQuery 3.0 or Latest version|
How to Create Animated Image Slider Using Jquery
1. In the initial step, load the jQuery (latest version) into your HTML document.
<!-- jQuery --> <script src="https://code.jquery.com/jquery-3.4.1.min.js"></script>
2. In next step, include plugin assets (from downloaded directory) in your website/app.
<!-- animated silder CSS --> <link rel="stylesheet" href="css/all.css"> <!-- animayed silder JS --> <script src="js/all.js"></script>
3. Create HTML structure like below:
<div id="main"> <div id="silder"> <img src="./img/bg1.jpg" class="silder-img"> <img src="./img/bg2.jpg" class="silder-img"> <img src="./img/bg3.jpg" class="silder-img"> </div> </div> <!-- Slider Buttons --> <div id="prvbtn">←</div> <div id="nxtbtn">→</div>
The plugin will be auto initialized (activated) after including all assets. If you like this plugin don’t forget to rate this.
- CSS updated.
- Initial release.
There are no reviews yet. Be the first one to write one.