Simple Carousel Slideshow with Transition Effect - monteserinGallery

Simple Carousel Slideshow with Transition Effect - monteserinGallery
File Size: 400 KB
Views Total:
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   

monteserinGallery is a simple jQuery Slideshow plugin that allows you to create a carousel like image slideshow with animated transition effect.

You might also like:

How to use it:

1. Include jQuery library and monteserinGallery.js on your page

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script type="text/javascript" src="js/monteserinGallery.js"></script>

2. The HTML

<ul id="demo">
<li> <img src="img/1.jpg"> </li>
<li> <img src="img/2.jpg"> </li>
</ul>

3. The CSS

#demo li{text-align:center;position: absolute; width:100%; height: 100%; left: 0; top:0;margin: 0; padding: 0}
#demo img{box-shadow: 10px 50px 100px black; top:0; margin: auto; width:60%;}
ul{list-style: none; padding:0;}

4. Call the plugin with options

<script type="text/javascript">
$(document).ready(function(){
$("#monteserinGallery").monteserinGallery({
initPosX : "-500px",
initPosY : "0px",
endPosX  : "500px",
endPosY  : "0px",
inTime: 1500,
outTime: 1500,
displayTime: "2000"
});
});
</script>

This awesome jQuery plugin is developed by unknown. For more Advanced Usages, please check the demo page or visit the official website.