|File Size:||2.95 MB|
|Official Website:||Go to website|
Flexi slider is a simple, easy, flexible jQuery slider plugin that you can put whatever you want inside it. It does not matter if it is a wall of text or a picture. You can even load it from a database through PHP or whatever you feel like.
How to use it:
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> <script src="js/flexi-slider.js"></script>
2. Create the left arrow container for your slider. You can put whatever image in here and the slider will count its height and will position it right in the middle
<div class="left-arrow-container"> <img class="slider-left" src="img/left.png" alt="left arrow"> </div>
3. Create slides for your slider. Each slide is a separate div element, CSS is included in the slider app so you need to style only the things you put inside the div with
<div class="slides"> <div class="slide"> Slide 1 </div> <div class="slide"> <div class="slide2"> Slide 2 </div> </div> <div class="slide"> <div class="slide3"> Slide 3 </div> </div> </div>
4. This is the right arrow remember to put first the left arrow then the slides and then the right arrow or if you do not want to, you do not have to put the arrows they just will not appear.
<div class="right-arrow-container"> <img class="slider-right" src="img/right.png" alt="right arrow"> </div>
5. Wrap the arrow containers and slides in a wrapper 'slider' and you're done.
<div class="slider"> ... </div>