Give your content boxes a stacked cards look. A different approach to carousels/sliders.
- Swipe support added for mobile.
- Removed "swapping of the cards on click" and replaced with "moving elements" to preserve the order of rendering.
- Removed coverflow effect (transforms causing lot of trouble with z-index)
Add stackedCards.css & stackedCards.js into your <head> section. You may add stackedCards.js before your closing </body> tag
<div class="mycards">
<ul>
<li>your content</li>
<li>your content</li>
<li>your content</li>
<li>your content</li>
<li>your content</li>
</ul>
</div>
var stackedCard = new stackedCards({
selector: '.mycards',
layout: "slide",
transformOrigin: "center",
});
stackedCard.init();