Every wonder how to hit the ground running with a jQuery plugin? Here is the absolute complete basics for you (and me) to copy and paste…
First we need to define our Class. I’ll call mine Boom.
var Boom = function(element, options){
this.init('boom', element, options);
};
So now we have something to focus our plugin at we can add a prototype method to it. This makes the ‘new Boom’ code super slick and gives us a better control over the ‘this’ variable because we can whack it inside a function…
Boom.prototype = {
init:function(type, element, options)
{
// do stuff on create
// makes it available almost anywhere as this.$element
this.$element = $(element);
// then maybe do something with the options
},
another_one:function()
{
// do some other clever stuff.
}
};
And finally we need to connect it up to the jQuery bit…
$.fn.boom = function (options) {
// return this makes it chainable
return this.each(function ()
{
new Boom(this, options);
});
};
$.fn.boom.Constructor = Boom;
Very basic, but worth having here for future use. You can now call it like so…
$('li.bang').boom();