var stackedCard = new stackedCards({
selector: '.stacked-cards',
layout: "slide",
transformOrigin: "center",
});
stackedCard.init();
FanOut
var stackedCard = new stackedCards({
selector: '.stacked-cards',
layout: "fanOut",
transformOrigin: "bottom",
});
stackedCard.init();
Usage
1. Setup HTML Markup
<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>
2. Add stackedCards.css & stackedCards.js into <head> You may add stackedCards.js before your closing </body> tag
<link rel="stylesheet" type="text/css" href="stackedCards.css"/>
<script src="stackedCards.js"><script>
3. Initialize the stackedCards in your script file
var stackedCard = new stackedCards({
selector: '.mycards',
layout: "slide",
transformOrigin: "center",
});
stackedCard.init();