List of Figures

 

Chapter 1. jQuery extensions

Figure 1.1. Sampler of jQuery UI widgets and styles

Figure 1.2. The Validation plugin in action, showing various error messages (in italics) resulting from validation issues, alongside the affected fields

Figure 1.3. The Nivo Slider in action

Figure 1.4. Google Map integration with the gMap plugin

Chapter 2. A first plugin

Figure 2.1. jQuery modules, showing dependencies and extension points

Figure 2.2. Ajax sequence diagram showing extension points

Figure 2.3. Watermark plugin in operation: before interaction, after entering first name, and ready to submit

Figure 2.4. The Watermark plugin sample page

Chapter 4. Plugin principles

Figure 4.1. Previous built-in Datepicker dialog box (left), compared with new jQuery UI dialog box with embedded Datepicker (right)

Figure 4.2. The Datepicker plugin progressively enhances a standard input field.

Figure 4.3. Datepicker customizations: (top row) default configuration, with buttons instead of links, with year navigation as well as month traversal; (bottom row) without the direct selection of month and year, and showing two months.

Figure 4.4. Datepicker localization: French, Japanese, and Arabic

Figure 4.5. Styling the Datepicker plugin with CSS: default, Redmond, and Humanity styles

Figure 4.6. Test your plugin in the major browsers to ensure the same appearance and behavior.

Figure 4.7. The MaxLength plugin demonstration page showing the effects of options