Set up
1. Embody Glitch Slider’s recordsdata in your web page:
- js / jquery-3.3.1.min.js (when you don’t have jQuery linked already)
- js / glitch-slider.js
- css / glitch-slider.css
<script src="./js/jquery-3.3.1.min.js"></script> <script src="./js/glitch-slider.js"></script> <hyperlink rel="stylesheet" href="./css/glitch-slider.css">
2. You could have construction in HTML web page like this:
<div id="glitch-slider"> <img src="image-3.jpg"> <img src="image-2.jpg"> <img src="image-1.jpg"> </div>
Every <img> tag shall be slider body. Use as a lot <img> tags as you want wrapped into <div> with `glitch-slider` ID.
Settings
The `glitch-slider.js` file has obtainable the next settings on the finish of the file:
- `pace` – time in milliseconds between transitions
- `buttons` – allow / disable navigation buttons
For the most effective outcome use picture dimension the identical like `glitch-slider` container dimension.