Christian Vuerings

Developing jQuery Plug-ins

May 26, 2011

Lately I’ve been developing jQuery plug-ins in my spare time. Definitely go and check out the example pages. One of the main reasons for doing this is to get a grip of the latest API changes in jQuery.

###Plug-ins

###Things I’ve learned

  • Make it chainable
    jQuery has many features, one of them is chainability. Which is the ability to chain one function after the other. The way to do this is by returning the original jQuery object.
$('a')
  .favicons()
  .css('color', '#ff0000');
  • Make it configurable
    Default options are OK, but make sure that people can modify the behavior without changing the actual code of the plug-in.
$("#lifestream").lifestream({
  "limit": 30,
  "list":[
    {
      "service": "twitter",
      "user": "christianvuerings"
    }
  ]
});
  • Make it extendible
    If someone do wants to add extra functionality to your plug-in, make sure they can. One way of doing this is by extending it.
$.fn.lifestream.feeds.lastfm = function(obj, callback){
  // ...
};

A great resource is the jQuery authoring guide.