Free Sample
+ Collection

jQuery UI 1.8: The User Interface Library for jQuery

Dan Wellman

Build highly interactive web applications with ready-to-use widgets from the jQuery User Interface library
RRP $26.99
RRP $44.99
Print + eBook

Want this title & more?

$12.99 p/month

Subscribe to PacktLib

Enjoy full and instant access to over 2000 books and videos – you’ll find everything you need to stay ahead of the curve and make sure you can always get the job done.

Book Details

ISBN 139781849516525
Paperback424 pages

About This Book

  • Packed with examples and clear explanations of how to easily design elegant and     powerful front-end interfaces for your web applications
  • A section covering the widget factory including an in-depth example on how to build a custom jQuery UI widget
  • Updated code with significant changes and fixes to the previous edition

Who This Book Is For

This book is for front-end designers and developers who need to quickly learn how to use jQuery UI. To get the most out of this book you should have a good working knowledge of HTML, CSS, and JavaScript, and should ideally be comfortable using jQuery.

Table of Contents

Chapter 1: Introducing jQuery UI
Downloading the library
Setting up a development environment
The structure of the library
Component categories
Browser support
Book examples
Library licensing
API introduction
Chapter 2: The CSS Framework and Other Utilities
The files that make up the framework
Linking to the required framework files
Using the framework classes
Interaction cues
Switching themes quickly and easily
Overriding the theme
The position utility
Collision avoidance
Positioning with a function
The widget factory
Creating the widget
The _create function
The common API methods
Adding custom methods
The widget style sheet
Using the widget
Chapter 3: Using the Tabs Widget
A basic tab implementation
Tab CSS framework classes
Applying a custom theme to the tabs
Configurable options
Tab events
Using tab methods
AJAX tabs
Changing the URL of a remote tab's content
Reloading a remote tab
Displaying data obtained via JSONP
Chapter 4: The Accordion Widget
Accordion's structure
Styling the accordion
Configuring an accordion
Accordion events
Accordion navigation
Accordion methods
Accordion interoperability
Chapter 5: The Dialog
Creating a basic dialog
Dialog options
Dialog's event model
Controlling a dialog programmatically
Getting data from the dialog
Dialog interoperability
Creating a dynamic image-based dialog
Chapter 6: The Slider Widget
Implementing a slider
Custom styling
Configurable options
Using slider's event API
Slider methods
Practical uses
A color slider
Chapter 7: The Datepicker Widget
The default datepicker
Configurable options of the datepicker
Utility methods
Date picking methods
An AJAX datepicker
Chapter 8: The Progressbar Widget
The default progressbar implementation
Progressbar's configuration options
Progressbar's event API
Progressbar methods
User initiated progress
Rich uploads with progressbar
Chapter 9: The Button and Autocomplete Widgets
The button widget
The autocomplete widget
Chapter 10: Drag and Drop
The deal with drag and droppables
Configuring draggable options
Draggable event callbacks
Draggable's methods
Configuring droppables
Droppable event callbacks
Droppable methods
A drag and drop game
Chapter 11: The Resizable Component
A basic resizable
Resizable options
Resizable callbacks
Resizable methods
Resizable tabs
Chapter 12: The Selectables Component
Basic implementation
Selectee classnames
Configurable options of the selectable component
Selectable callbacks
Selectable methods
A selectable image viewer
Chapter 13: The Sortables Component
The default implementation
Configuring sortable options
Reacting to sortable events
Connected callbacks
Sortable methods
Widget compatibility
Chapter 14: UI Effects
The core effects file
Highlighting specified elements
Shaking an element
Element scaling
Element explosion
The puff effect
The pulsate effect
Dropping elements onto the page
Sliding elements open or closed
The window-blind effect
Clipping elements
Folding elements

What You Will Learn

  • How the CSS framework consistently themes the widgets and how these styles can be used in your own code
  • Create a custom jQuery UI widget using the widget library
  • The underlying mark-up required by different components, and how each widget or interaction helper is initialized
  • Configure the different components, and the different options that each component uses
  • Work with each widget programmatically using its methods and event hooks
  • Practical examples of how each component can be used
  • Add flair to your interface with animation effects

In Detail

jQuery UI, the official suite of plugins for the jQuery JavaScript library, gives you a solid platform on which to build rich and engaging interfaces with maximum compatibility, stability, and a minimum of time and effort.

jQuery UI has a series of ready-made user interface widgets and a comprehensive set of core interaction helpers to reduce the amount of code that you need to write to take a project from conception to completion.

jQuery UI 1.8: The User Interface Library for jQuery has been specially revised for version 1.8 of jQuery UI. It is written to maximize your experience with the library by breaking down each component and walking you through examples that progressively build upon your knowledge, taking you from beginner to advanced usage in a series of easy-to-follow steps.

Throughout the book, you'll learn how each component can be initialized in a basic default implementation and then customize and configure each component to tailor it to your application. You'll look at the configuration options and the methods exposed by each component's API to see how these can be used to bring out the best of the library. Each chapter will also show you the custom events fired by the component covered and how these events can be intercepted and acted upon.


Read More