One of the Best JQuery Slideshow Plugins (Ever)

I use JQuery all the time. It’s hands down my favorite javascript library (though Ext3 is pretty impressive). One of my most used and favorite plugins is malsup’s cycle plugin.

Here are a few reasons why this ranks in at my favorite plugin:

1) Easy to install / utilize
It’s incredibly simple to use. The minimal setup required would be something like this.

<div class="slideshow">
	<img src="wonderful_walrus_and_tucan_sam.jpg" width="200" height="200" />
	<img src="image_2.jpg" width="200" height="200" />
	<img src="pretty_cow_4.jpg" width="200" height="200" />
</div>

Then all you need to do is throw this the <head> section of your page:

<!-- include jQuery library -->
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
<!-- include Cycle plugin -->
<script type="text/javascript" src="http://cloud.github.com/downloads/malsup/cycle/jquery.cycle.all.latest.js"></script>
<script type="text/javascript">
$(document).ready(function() {
    $('.slideshow').cycle({
		fx: 'fade' // choose your transition type, ex: fade, scrollUp, shuffle, etc...
	});
});
</script>

2) Simple to modify and customize

Not only are there easily over 40 examples of different implementations but the code is well written and simple to understand. I can’t even begin to tell you how many times I’ve used cycle as a starting point to code a different slideshow plugin. It’s so useful!

3) It’s 100% Free

Yep, it’s free and open source. Check it out here:
JQuery Cycle

Leave a Reply

Your email address will not be published. Required fields are marked *