Book Image

Mastering jQuery

By : Alex Libby
Book Image

Mastering jQuery

By: Alex Libby

Overview of this book

<p>Mastering jQuery has been written not only to help maximize your skills with core functionality in the library, but also to explore some of the more intriguing ways of using the library to achieve real-world solutions that could feature on any website or online environment.</p> <p>You'll start with a look at some of the more advanced ways to incorporate the library into your pages, followed by working with forms and advanced form validation using regular expressions. Next you'll move on to animating in jQuery, advanced event handling, and using jQuery effects.</p> <p>Finally, you will develop practical examples of using jQuery with external functionality such as node-webkit, before finishing with a session on optimizing your version of the library for maximum efficiency and exploring best practices for using QUnit.</p>
Table of Contents (21 chapters)
Mastering jQuery
Credits
About the Author
About the Reviewers
www.PacktPub.com
Preface
Index

Preface

Imagine a scenario, if you will, where you're an intermediate-level developer, reasonably au fait with writing code, who feels that there should be more to developing jQuery than just punching keys into a text editor.

You'd be right; anyone can write code. To take that step towards being a more rounded developer, we must think further afield. Gone are the days of writing dozens of chained statements that take a degree to understand and debug, and in their place are the decisions that help us make smarter decisions about using jQuery and that make more effective use of time in our busy lives.

As an author, I maintain that simple solutions frequently work better than complex solutions; throughout this book, we'll take look at a variety of topics that will help develop your skills, make you consider all the options, and understand that there is more to writing jQuery code.

It's going to be a great journey, with more twists and turns than a detective novel; the question is, "Are you ready?" If the answer is yes, let's make a start…

What this book covers

Chapter 1, Installing jQuery, kicks off our journey into the world of mastering jQuery, where you will learn that there is more to downloading and installing jQuery than simply using CDN or local links. We'll take a look at how to install jQuery using package managers, how we can customize the elements of our download, as well as how to add source maps and more to help fine-tune our copy of the library.

Chapter 2, Customizing jQuery, takes things further—you may find that the elements of jQuery don't quite work the way you want. In this chapter, we'll take a look at how you can create and distribute patches that can be applied temporarily in order to extend or alter the core functionality within jQuery.

Chapter 3, Organizing Your Code, explores the use of jQuery design patterns, which is a useful concept in maintaining well-organized code that makes developing and debugging easier. We'll take a look at some examples of patterns and how they fit in with jQuery.

Chapter 4, Working with Forms, takes a look at the doyen of form functionality - validating responses on forms. We'll explore how you can be more effective at form validation, before using it to great effect in a contact form that employs AJAX, and develop a file upload form.

Chapter 5, Integrating AJAX, examines how we can improve the speed of loading data on static sites, with the use of callbacks to help manage multiple AJAX requests. We'll take a look at AJAX best practices and explore how best to manage these requests through the use of jQuery's Deferreds and Promises functionalities.

Chapter 6, Animating in jQuery, takes us on a journey to discover how we can be smarter at managing animations within jQuery, and explores how best to manage the jQuery queue to prevent animation build-ups. We'll also learn how we can implement custom animations and why jQuery isn't always the right tool to use in order to move elements on a page.

Chapter 7, Advanced Event Handling, examines how many developers may simply use .on() or .off() to handle events, but you'll see that there is more to using these methods, if you really want to take advantage of jQuery. We'll create a number of custom events before we explore the use of event delegation to better manage when these event handlers are called in our code.

Chapter 8, Using jQuery Effects, continues our journey, with a quick recap on using effects in jQuery, as we explore how we can create custom effects with callbacks and learn how to better manage the queue that forms the basis of their use within jQuery.

Chapter 9, Using the Web Performance APIs, starts the second part of the book, where we explore some of the more interesting options available to us when using jQuery. In this chapter, we'll discover how to use the Page Visibility API with jQuery and see how we can use it to provide a smoother appearance, reduce resources, and still maintain complex animations on our pages. Intrigued? You will be, when you visit this chapter!

Chapter 10, Manipulating Images, illustrates how, with the use of jQuery and some reasonably simple math, we can apply all kinds of effects to images. We can perform something as simple as blurring images to creating custom effects. We'll then use some of these techniques to create a simple signature page that exports images, and apply all kinds of effects to images extracted from your own webcam.

Chapter 11, Authoring Advanced Plugins, covers one of the key topics of using jQuery: creating and distributing plugins. With more and more functionality being moved to using plugins, we'll cover some of the tips and tricks behind creating your own plugins; you'll see that there is more to it than just writing code!

Chapter 12, Using jQuery with the Node-WebKit Project, explores an interesting library that takes the best elements of Node, JavaScript/jQuery, CSS, and plain HTML and combines them into something that blurs the boundaries between desktops and the online world. We'll work through some existing online code and convert it for use as a desktop application, before packaging it and making it available for download online.

Chapter 13, Enhancing Performance in jQuery, takes you through some of the considerations, tips, and tricks that you need to use in order to optimize and enhance the performance of your code. You'll see how easy it is to get the basics from DOM inspectors, such as Firebug, right through to automating your tests with Grunt, and finally developing a strategy to keep monitoring the performance of your code.

Chapter 14, Testing jQuery, is the concluding chapter in our journey through the world of mastering jQuery, where we will take a look at testing our code using QUnit and how we can take advantage of Grunt to automate an otherwise routine but important task within the world of developing with jQuery.

What you need for this book

All you need to work through most of the examples in this book is a simple text or code editor, a copy of the jQuery library, Internet access, and a browser. I recommend that you install Sublime Text—either version 2 or 3; it works well with Node and Grunt, which we will use at various stages throughout the book.

Some of the examples make use of additional software, such as Node or Grunt—details are included within the appropriate chapter along with links to download the application from its source.

Who this book is for

The book is for frontend developers who want to do more than just write code, but who want to explore the tips and tricks that can be used to expand their skills within jQuery development. To get the most out of this book, you should have a good knowledge of HTML, CSS, and JavaScript and ideally be at an intermediate level with jQuery.

Conventions

In this book, you will find a number of styles of text that distinguish between different kinds of information. Here are some examples of these styles, and an explanation of their meaning.

Code words in text are shown as follows: "We'll start by extracting the relevant files from the code download for this book; for this demo, we'll need clicktoggle.css, jquery.min.js, and clicktoggle.html."

A block of code is set as follows:

$(this).on("click", function() {
  if (clicked) {
    clicked = false;
      return b.apply(this, arguments);
    }
    clicked = true;
    return a.apply(this, arguments);
  });
});

When we wish to draw your attention to a particular part of a code block, the relevant lines or items are set in bold:

$('#section').hide(2000, 'swing', function() {
  $(this).html("Animation Completed");
});

Any command-line input or output is written as follows:

npm install jquery

New terms and important words are shown in bold. Words that you see on the screen, in menus or dialog boxes for example, appear in the text like this: "When we view the page and select the Images tab, after a short delay we should see six new images."

Note

Warnings or important notes appear in a box like this.

Tip

Tips and tricks appear like this.

Reader feedback

Feedback from our readers is always welcome. Let us know what you think about this book – what you liked or may have disliked. Reader feedback is important for us to develop titles that you really get the most out of.

To send us general feedback, simply send an e-mail to , and mention the book title via the subject of your message.

If there is a book that you need and would like to see us publish, please send us a note in the SUGGEST A TITLE form on www.packtpub.com or e-mail .

If there is a topic that you have expertise in and you are interested in either writing or contributing to a book, see our author guide on www.packtpub.com/authors.

Customer Support

Now that you are the proud owner of a Packt book, we have a number of things to help you get the most from your purchase.

Downloading the example code

You can download the example code files for all Packt books you have purchased from your account at http://www.packtpub.com. If you purchased this book elsewhere, you can visit http://www.packtpub.com/support and register to have the files e-mailed directly to you.

Errata

Although we have taken every care to ensure the accuracy of our content, mistakes do happen. If you find a mistake in one of our books – maybe a mistake in the text or the code – we would be grateful if you would report this to us. By doing so, you can save other readers from frustration and help us to improve subsequent versions of this book. If you find any errata, please report them by visiting http://www.packtpub.com/support, selecting your book, clicking on the Errata Submission Form link, and entering the details of your errata. Once your errata are verified, your submission will be accepted and the errata will be uploaded on our website, or added to any list of existing errata, under the Errata section of that title.

To view the previously submitted errata, go to https://www.packtpub.com/books/content/support and enter the name of the book in the search field. The required information will appear under the Errata section.

Piracy

Piracy of copyright material on the Internet is an ongoing problem across all media. At Packt, we take the protection of our copyright and licenses very seriously. If you come across any illegal copies of our works, in any form, on the Internet, please provide us with the location address or website name immediately so that we can pursue a remedy.

Please contact us at with a link to the suspected pirated material.

We appreciate your help in protecting our authors, and our ability to bring you valuable content.

Questions

You can contact us at if you are having a problem with any aspect of the book, and we will do our best to address it.