JQuery: Novice to Ninja
Castledine (Earle) & Sharkie (Craig)
Source: Castledine (Earle) & Sharkie (Craig) - JQuery: Novice to Ninja
Paper - Abstract

Paper StatisticsColour-ConventionsDisclaimer


  1. No matter what kind of ninja you are — a cooking ninja, a corporate lawyer ninja, or an actual ninja ninja — virtuosity lies in first mastering the basic tools of the trade. Once conquered, it’s then up to the full-fledged ninja to apply that knowledge in creative and inventive ways.
  2. In recent times, jQuery has proven itself to be a simple but powerful tool for taming and transforming web pages, bending even the most stubborn and aging browsers to our will. jQuery is a library with two principal purposes: manipulating elements on a web page, and helping out with Ajax requests. Sure, there are quite a few commands available to do this — but they’re all consistent and easy to learn. Once you’ve chained together your first few actions, you’ll be addicted to the jQuery building blocks, and your friends and family will wish you’d never discovered it!
  3. On top of the core jQuery library is jQuery UI: a set of fine-looking controls and widgets (such as accordions, tabs, and dialogs), combined with a collection of fullfeatured behaviors for implementing controls of your own. jQuery UI lets you quickly throw together awesome interfaces with little effort, and serves as a great example of what you can achieve with a little jQuery know-how.
  4. At its core, jQuery is a tool to help us improve the usability of our sites and create a better user experience. Usability refers to the study of the principles behind an object’s perceived efficiency or elegance. Far from being merely flashy, trendy design, jQuery lets us speedily and enjoyably sculpt our pages in ways both subtle and extreme: from finessing a simple sliding panel to implementing a brand-new user interaction you invented in your sleep.
  5. Becoming a ninja isn’t about learning an API inside out and back to front — that’s just called having a good memory. The real skill and value comes when you can apply your knowledge to making something exceptional: something that builds on the combined insights of the past to be even slightly better than anything anyone has done before. This is certainly not easy — but thanks to jQuery, it’s fun just trying.
What’s in This Book
  1. By the end of this book, you’ll be able to take your static HTML and CSS web pages and bring them to life with a bit of jQuery magic. You’ll learn how to select elements on the page, move them around, remove them entirely, add new ones with Ajax, animate them … in short, you’ll be able to bend HTML and CSS to your will! We also cover the powerful functionality of the jQuery UI library.
  2. This book comprises the following nine chapters. Read them in order from beginning to end to gain a complete understanding of the subject, or skip around if you only need a refresher on a particular topic.
  3. Chapter 1: Falling in Love with jQuery
    Before we dive into learning all the ins and outs of jQuery, we’ll have a quick look at why you’d want to use it in the first place: why it’s better than writing your own JavaScript, and why it’s better than the other JavaScript libraries out there. We’ll brush up on some CSS concepts that are key to understanding jQuery, and briefly touch on the basic syntax required to call jQuery into action.
  4. Chapter 2: Selecting, Decorating, and Enhancing
    Ostensibly, jQuery’s most significant advantage over plain JavaScript is the ease with which it lets you select elements on the page to play with. We’ll start off this chapter by teaching you how to use jQuery’s selectors to zero in on your target elements, and then we’ll look at how you can use jQuery to alter those elements’ CSS properties.
  5. Chapter 3: Animating, Scrolling, and Resizing
    jQuery excels at animation: whether you’d like to gently slide open a menu, or send a dialog whizzing across the screen, jQuery can help you out. In this chapter, we’ll explore jQuery’s wide range of animation helpers, and put them into practice by enhancing a few simple user interface components. We’ll also have a quick look at some animation-like helpers for scrolling the page and making elements resizable.
  6. Chapter 4: Images, Slideshows, and Cross-fading
    With the basics well and truly under our belts, we’ll turn to building some of the most common jQuery widgets out there: image galleries and slideshows. We’ll learn how to build lightbox displays, scrolling thumbnail galleries, crossfading galleries, and even take a stab at an iPhoto-style flip-book.
  7. Chapter 5: Menus, Tabs, Tooltips, and Panels
    Now that we’re comfortable with building cool UI widgets with jQuery, we’ll dive into some slightly more sophisticated controls: drop-down and accordion-style menus, tabbed interfaces, tooltips, and various types of content panels. We’re really on a roll now: our sites are looking less and less like the brochure-style pages of the nineties, and more and more like the Rich Internet Applications of the twenty-first century!
  8. Chapter 6: Construction, Ajax, and Interactivity
    This is the one you’ve all been waiting for: Ajax! In order to make truly desktop-style applications on the Web, you need to be able to pass data back and forth to and from the server, without any of those pesky refreshes clearing your interface from the screen — and that’s what Ajax is all about. jQuery includes a raft of convenient methods for handling Ajax requests in a simple, cross-browser manner, letting you leave work with a smile on your face. But before we get too carried away — our code is growing more complex, so we’d better take a look at some best practices for organizing it. All this and more, in Chapter 6.
  9. Chapter 7: Forms, Controls, and Dialogs
    The bane of every designer, forms are nonetheless a pivotal cornerstone of any web application. In this chapter, we’ll learn what jQuery has to offer us in terms of simplifying our form-related scripting. We’ll learn how to validate forms on the fly, offer assistance to our users, and manipulate checkboxes, radio buttons, and select lists with ease. Then we’ll have a look at some less conventional ways of allowing a site’s users to interact with it: a variety of advanced controls like date pickers, sliders, and drag and drop. We’ll round it off with a look at modal1 dialogs in the post-popup world, as well as a few original non-modal2 notification styles. What a chapter!
  10. Chapter 8: Lists, Trees, and Tables
    No matter how “Web 2.0” your application may be, chances are you’ll still need to fall back on the everyday list, the humdrum tree, or even the oft-derided table to present information to your users. This chapter shows how jQuery can make even the boring stuff fun, as we’ll learn how to turn lists into dynamic, sortable data, and transform tables into data grids with sophisticated functionality.
  11. Chapter 9: Plugins, Themes, and Advanced Topics
    jQuery is more than just cool DOM manipulation, easy Ajax requests, and funky UI components. It has a wealth of functionality aimed at the more ninja-level developer: a fantastic plugin architecture, a highly extensible and flexible core, customizable events, and a whole lot more. In this chapter, we’ll also cover the jQuery UI theme system, which lets you easily tailor the appearance of jQuery UI widgets to suit your site, and even make your own plugins skinnable with themes.

Text Colour Conventions (see disclaimer)

  1. Blue: Text by me; © Theo Todman, 2019
  2. Mauve: Text by correspondent(s) or other author(s); © the author(s)

© Theo Todman, June 2007 - March 2019. Please address any comments on this page to theo@theotodman.com. File output:
Website Maintenance Dashboard
Return to Top of this Page Return to Theo Todman's Philosophy Page Return to Theo Todman's Home Page