Funny jQuery Card Deck Slideshow Plugin

File Size: 108KB
Views Total: 2419
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
Funny jQuery Card Deck Slideshow Plugin

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.