A little dab'll do ya
Code Snippets
jQuery Plugin Template
Replace instances of "yourPluginName" with your actual plugin name. The stuff about "radius" is just an example of an option (parameter to pass plugin).
(function($){
$.yourPluginName = function(el, radius, options){
// To avoid scope issues, use 'base' instead of 'this'
// to reference this class from internal events and functions.
var base = this;
// Access to jQuery and DOM versions of element
base.$el = $(el);
base.el = el;
// Add a reverse reference to the DOM object
base.$el.data("yourPluginName", base);
base.init = function(){
if( typeof( radius ) === "undefined" || radius === null ) radius = "20px";
base.radius = radius;
base.options = $.extend({},$.yourPluginName.defaultOptions, options);
// Put your initialization code here
};
// Sample Function, Uncomment to use
// base.functionName = function(paramaters){
//
// };
// Run initializer
base.init();
};
$.yourPluginName.defaultOptions = {
radius: "20px"
};
$.fn.yourPluginName = function(radius, options){
return this.each(function(){
(new $.yourPluginName(this, radius, options));
// HAVE YOUR PLUGIN DO STUFF HERE
// END DOING STUFF
});
};
})(jQuery);Usage
$(function() {
$("#round-me").yourPluginName("20px");
});
That’s very useful, thanks!
Another very nice and useful snippet!
keep up the good work!
Nice template. Quite a different layout from others I’ve seen, but will definitely give this a go.
Here’s an alternative jQuery plugin template.
Thanks
Nice template.
This template is totally different from jquery docs. Are their any benefits to this type of template format?
I find this template the best out of all the ones I’ve used. It’s been my starting point for the past couple years.
I don’t completely follow the logic of its organization. I think it would be easier to understand if your example had some event driven functionality.