How to Build a Simple Content Slider jQuery Plugin


I was recently asked by a reader to recommend a helpful content slider plugin. No doubt, there are a bunch of excellent options available -- some which are, perhaps, too excellent! With so much flexibility comes extra weight; especially when sometimes you only need a simple slide or fade transition.

So I figured, why not build a simple custom plugin that will get the job done?

P.S. Speed Up

Don't forget to take advantage of bundles when working in Textmate. If you need a helpful snippet to jump-start every new jQuery plugin, create a new snippet in Textmate, paste the following code in, and then assign a short-cut - like "jqueryplugin."

(function(\$) {
	\$.fn.$1 = function(options) {

		var defaults = {

		options = \$.extend(defaults, options);
		this.each(function() {
			var \$this = \$(this);		

            return this;
		}); // end each


This is the only the first step. In the next screencast, we'll continue refining this plugin, and adding more options/conveniences.