Book Image

jQuery Plugin Development Beginner's Guide

By : Giulio Bai
Book Image

jQuery Plugin Development Beginner's Guide

By: Giulio Bai

Overview of this book

<p>jQuery is the most famous JavaScript library. If you use jQuery a lot, it can be a good idea to start packaging your code into plugins. A jQuery plugin is simply a way to put your code into a package, which makes it easier to maintain your code and use across different projects. While basic scripting is relatively straightforward, writing plugins can leave people scratching their heads.<br /><br />With this exhaustive guide in hand, you can start building your own plugins in a matter of minutes! This book takes you beyond the basics of jQuery and enables you to take full advantage of jQuery's powerful plugin architecture to deliver highly interactive content to your website viewers.<br /><br />This book contains all the information you need to successfully author your very own jQuery plugin with a particular focus on the practical aspect of design and development. <br /><br />This book will also cover some details of real life plugins and explain their functioning to gain a better understanding of the overall concept of plugin development and jQuery plugin architecture.<br /><br />Different topics regarding plugin development are discussed, and you will learn how to develop many types of add-ons, ranging from media plugins (such as slideshows, video and audio controls, and so on) to various utilities (image pre-loading, handling cookies) and use and applications of jQuery effects and animations (sliding, fading, combined animations) to eventually demonstrate how all of these plugins can be merged and give birth to a new, more complex, and multipurpose script that comes in handy in a lot of situations.</p>
Table of Contents (20 chapters)
jQuery 1.4 Plugin Development
Credits
About the Author
About the Reviewers
Preface

Time for action — using the plugin


A sample application of the PassRoids plugin is shown in the following example, which gives a useful hint for those interested in an quick and easy way to check field values.

  1. 1. The basic layout for the page on which the plugin will work should look similar to the following:

    <html>
    <head>
    <script src="jquery.js" type="text/javascript"></script>
    <script src="jquery.passroids.js" type="text/javascript"> </script>
    <script type="text/javascript">
    $(document).ready (function () {
    // code
    });
    </script>
    </head>
    <body>
    <form>
    Password: <input type="password" name="pass_test" value="" id="pass_test" />
    Password (again): <input type="password" name="pass_test_verify" value="" id="pass_test_verify" />
    <input type="submit" name="pass_test_submit" value="Change password" id="pass_test_submit" />
    </form>
    </body>
    </html>
    
  2. 2. It is important to note that some elements must...