Funny jQuery Card Deck Slideshow Plugin
File Size: | 108KB |
---|---|
Views Total: | 2456 |
Last Update: | |
Publish Date: | |
Official Website: | Go to website |
License: | MIT |
Card Deck Slideshow is a funny jQuery slideshow plugin that rotates and "unhinges" each slide to show the next using CSS3 transforms, similar to a stacked pile of cards. Please check the demo page see it in action. The slideshow supports all the html content like image, text, ajax content, etc.
How to use it:
1. Include jQuery library and Card Deck Slideshow on your html page
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="carddeckslideshow.js">
2. Include Card Deck Slideshow to style your slideshow
<link rel="stylesheet" href="carddeckslideshow.css" />
3. Create a container for your slideshow
<div id="demo" class="stackcontainer"> <div class="inner"> <img src="1.jpg" /> </div> <div class="inner"> <img src="2.jpg" /> </div> <div class="inner"> <img src="3.jpg" /> </div> <div class="inner"> <img src="4.jpg" /> </div> ... </div> <a href="javascript: demo2.navigate('prev')">Previous Slide</a> <a href="javascript: demo2.navigate('next')">Next Slide</a>
4. The javascript
<script> var demo1 = new carddeckslideshow({ id: 'demo', hingepoint: 'top right', fxduration: 1000 }) </script>
This awesome jQuery plugin is developed by dynamicdriverepo. For more Advanced Usages, please check the demo page or visit the official website.