Accordion Slider is a kind of slider design pattern that enables the user to expand/collapse slides just like an accordion.
How Accordion Slider Works?
An Accordion Slider collapses slides into an accordion-style interface where the user can reveal the full content of a slide by clicking or hovering the accordion header.
The Best Accordion Slider
Originally Published Oct 29 2019, updated Mar 03 2023
Table of contents:
A simple and use-to-use Accordion Plugin built with jQuery that allows you to implement horizontal accordion effects into your websites.
A jQuery plugin that helps you create responsive, touch-friendly, retina-ready accordion sliders for presenting anything on the page.
A jQuery plugin used to create a smooth, expandable carousel from a list of images. When you click on a thumbnail, it zooms out to the overall carousel size to display the original version of the image like an accordion.
A jQuery and CSS3 powered responsive, skewed accordion slider that enables the user to expand each image on mouse hover.
Pure CSS Accordion Sliders:
A responsive horizontal accordion created by ferry that makes use of CSS3 transitions and transforms to smoothly expand accordion items on mouse hover.
A pure CSS/CSS3 based responsive accordion slider that allows you to horizontally expands the images on mouse hover. On small screens such as mobile devices, the accordion slider will be transformed into a vertical image list to fit its parent container.
A smooth, responsive, vertical accordion UI that expands the current accordion panel on mouse hover, built using pure CSS and flexbox model.
A pure CSS/CSS3 accordion slider that you are able to expand the desired slide into full size on mouse hover or touch tap. Responsive layout based on CSS3 flexbox model. Currently comes with 5 fancy transition effects.
An accordion style smooth content slider created by dp_lewis that allows you to expand the current slide with a smooth sliding animation when hover over, built with CSS3 flex and transition properties.