Accordion-style Horizontal Slider Plugin - jQuery Accordion.js

A tiny and easy-to-use jQuery plugin to create an accordion-style horizontal slider from an array of images. Hovering over the slides will expand the image to full width, just like a traditional accordion.

See Also:

• 10 Best Accordion Sliders In JavaScript Or Pure CSS

How to use it:

1. Create an empty DIV to hold the accordion slider.

<div id="demo">
</div>

2. Load the Accordion.js after jQuery.

<script src="/path/to/cdn/jquery.min.js"></script>
<script src="/path/to/js/accordion.js"></script>

3. Initialize the plugin and store your image data in an JS array as follows:

$.as({
  id: "demo",
  folder: "images",
  images: ["1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg"],
  imgWidth: 700,
});

4. Config the animation speed

$.as({
  id: "demo",
  folder: "images",
  images: ["1.jpg", "2.jpg", "3.jpg", "4.jpg", "5.jpg"],
  imgWidth: 700,
  speed: 2000,
});

---

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