It’s pretty easy to turn your code straight into jQuery plugin ready for use with any website. The hardest part is finding a way to properly structure your code so it is independent and easy to use.
Advantage of converting jQuery code into a plugin
- efficiently organizing jQuery code
- your code becomes easier to modify and follow
- repetitive tasks are handled naturally
- improves the speed with which you develop
- plugins are organised and promotes code reuse
Creating jQuery Plugin Tips
Leave specifics out of the code (ie anything that relates directly to the example that the jQuery code is being used for).
Rewtite code to include the “this” object instead of hard-coding a selector to make it more generic
jQuery Plugin Structure
How to convert jQuery Code to a plugin
All you need to do is extend the $.fn object with your own function (Let’s not reinvent the wheel, see the example below!).
Examples of Simple jQuery Plugins and Tutorials
- Simple Plugin Tutorial to Animate a Menu
- Plugins/Authoring Official Documentation
- jQuery Plugin Tutorial, In-Depth For Absolute Beginners
- How to Build a Simple Content Slider jQuery Plugin
- The Definitive Guide to Creating a Practical jQuery Plugin
- How To Create A Plugin For jQuery
- Learn How to Create a jQuery Plugin
- A Plugin Development Pattern