Adding Functionality with Plugins - J Query

The jQuery library is a small, slick, powerful JavaScript library, but it doesn’t come preloaded with every piece of functionality that you may need.


jQuery was built with extensibility in mind. If the core jQuery library can’t do what you want, chances are a jQuery plugin author has written a plugin that will handle your need, probably in as little as one line of code.
To include a plugin on your page, all you need to do is download the plugin .jsfile,include the jQuery library on the page, then immediately after, include your plugin on the page. Then, in either another .jsfile or in a script block on the page, you’ll typically need to call the plugin and provide any options that may be required.
Here is an example using the jQuery cycle plugin developed by Mike Alsup:


Figure : shows the output.

With one line of code, we are able to make a slide show effect that will show one image at a time and then fade to the next image automatically. The cycle plugin is also extensible because it was written so developers can provide different options to have different transition effects and layouts.


jQuery has one of the largest communities of developers of any of the JavaScript libraries.This large community contributes to a large base of plugins and tutorials that are available on the Web. jQuery hosts a repository of plugins that have been written and submitted to by the authors. There are currently more than 1,600 plugins listed in the repository, and you can find plugins in many different categories.Plugin authors are invited to submit their plugins and to give a description, a link to the plugin, and a link to the plugin’s documentation. The repository makes it easy for developers to search for the specific functionality they want.
Chances are that, as a developer, you will eventually find a plugin that meets your requirements. But on the off chance that a plugin doesn’t exist, creating a plugin yourself is fairly straightforward. Here are some points to remember:

  • Name your file jquery.[name of plugin].js, as in jquery.debug.js.

  • All new methods are attached to the jQuery.fnobject; all functions to the jQuery object.

  • Inside methods, this is a reference to the current jQuery object.

  • Any methods or functions you attach must have a semicolon (;) at the end—otherwise, the code will break when compressed.

  • Your method must return the jQuery object, unless explicitly noted otherwise.

  • You should use this.each to iterate over the current set of matched elements—it produces clean and compatible code that way.

  • Always use jQuery instead of $ inside your plugin code—that allows users to change the alias for jQuery in a single place.

All rights reserved © 2018 Wisdom IT Services India Pvt. Ltd Protection Status

J Query Topics