Multi-Style jQuery Image Carousel Plugin - Oka Slider

File Size: 1.14 MB
Views Total: 4086
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Multi-Style jQuery Image Carousel Plugin - Oka Slider

Oka Slider is a jQuery plugin for creating a fully responsive image carousel that comes with more than ten different slider types.

How to use it:

1. Import jQuery library and the jQuery Oka Slider plugin's files into your document.

<link rel="stylesheet" href="css/oka_slider_model.css">
<script src="//code.jquery.com/jquery-1.11.1.min.js"></script>
<script src="js/oka_slider_model.js"></script>

2. Markup Html structure.

<div class="slider_model">
  <div class="slider_model_box">
    <img src="1.jpg" title="Caption1" alt="Long Description">
    <img src="2.jpg" title="Caption2" alt="Long Description">
    <img src="3.jpg" title="Caption3" alt="Long Description">
    <img src="4.jpg" title="Caption4" alt="Long Description">
    <img src="5.jpg" title="Caption5" alt="Long Description">
    <img src="6.jpg" title="Caption6" alt="Long Description">
    <img src="7.jpg" title="Caption7" alt="Long Description">
    <img src="8.jpg" title="Caption8" alt="Long Description">
  </div>
</div>

3. Active the image carousel slider.

$('.slider_model').oka_slider_model();

4. Customize the image carousel slider.

$('.slider_model').oka_slider_model({

// slider type. 0~9
'type': 1,

// animation speed
'animateSpeed': 300,

// autoplay interval
'speed': 5000

});

This awesome jQuery plugin is developed by okaoka0709. For more Advanced Usages, please check the demo page or visit the official website.