Overview
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.
Table of Contents
Chapter 1: Introducing jQuery UI
Downloading the library
Setting up a development environment
The structure of the library
ThemeRoller
Component categories
Browser support
Book examples
Library licensing
API introduction
Events and callbacks
Callback arguments
Summary
Chapter 2: The CSS Framework and Other Utilities
The files that make up the framework
jquery.ui.all.css
jquery.ui.base.css
jquery.ui.core.css
The individual component framework files
jquery.ui.theme.css
Linking to the required framework files
Using the framework classes
Containers
Interactions
Icons
Interaction cues
Switching themes quickly and easily
Overriding the theme
The position utility
Using 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
Summary
Chapter 3: Using the Tabs Widget
A basic tab implementation
Tab CSS framework classes
Applying a custom theme to the tabs
Configurable options
Selecting a tab
Disabling a tab
Transition effects
Collapsible tabs
Tab events
Binding to events
Using tab methods
Enabling and disabling tabs
Adding and removing tabs
Simulating clicks
Creating a tab carousel
Getting and setting options
AJAX tabs
Changing the URL of a remote tab's content
Reloading a remote tab
Displaying data obtained via JSONP
Summary
Chapter 4: The Accordion Widget
Accordion's structure
Styling the accordion
Configuring an accordion
Changing the trigger event
Changing the default active header
Filling the height of its container
Accordion animation
Accordion events
Using the change event
The changestart event
Accordion navigation
Accordion methods
Header activation
Resizing an accordion panel
Accordion interoperability
Summary
Chapter 5: The Dialog
Creating a basic dialog
Dialog options
Showing the dialog
The title of the dialog
Modality
Adding buttons
Enabling dialog animations
Configuring the dialog's dimensions
Stacking
Dialog's event model
Controlling a dialog programmatically
Toggling the dialog
Getting data from the dialog
Dialog interoperability
Creating a dynamic image-based dialog
Summary
Chapter 6: The Slider Widget
Implementing a slider
Custom styling
Configurable options
Creating a vertical slider
Minimum and maximum values
Slider steps
Slider animation
Setting the slider's value
Using multiple handles
The range element
Using slider's event API
Slider methods
Practical uses
A color slider
Summary
Chapter 7: The Datepicker Widget
The default datepicker
Configurable options of the datepicker
Basic options
Minimum and maximum dates
Changing the elements in the datepicker UI
Adding a trigger button
Configuring alternative animations
Multiple months
Changing the date format
Updating an additional input element
Localization
Callback properties
Utility methods
Date picking methods
Selecting a date programmatically
Showing the datepicker in a dialog box
An AJAX datepicker
Summary
Chapter 8: The Progressbar Widget
The default progressbar implementation
Progressbar's configuration options
Setting progressbar's value
Progressbar's event API
Progressbar methods
User initiated progress
Rich uploads with progressbar
Summary
Chapter 9: The Button and Autocomplete Widgets
The button widget
Standard implementations
Theming
Configurable options
Button icons
Input icons
Button events
Buttonsets
Checkbox buttonsets
Radio buttonsets
Button methods
The autocomplete widget
Working with local data sources
Using an array of objects as the data source
Configurable autocomplete options
Configuring minimum length
Appending the suggestion list to an alternative element
Autocomplete events
Autocomplete methods
Working with remote data sources
Using a string as the value of the source option
Using a function as the value of the source option
Displaying HTML in the list of suggestions
Summary
Chapter 10: Drag and Drop
The deal with drag and droppables
Draggables
A basic drag implementation
Configuring draggable options
Using the configuration options
Resetting dragged elements
Drag handles
Helper elements
Constraining the drag
Snapping
Draggable event callbacks
Draggable's methods
Droppables
Configuring droppables
Configuring accepted draggables
Tolerance
Droppable event callbacks
Scope
Greedy
Droppable methods
A drag and drop game
Summary
Chapter 11: The Resizable Component
A basic resizable
Resizable options
Configuring resize handles
Adding additional handle images
Defining size limits
Resizing ghosts
Containing the resize
Handling aspect ratio
Resizable animations
Simultaneous resizing
Preventing unwanted resizes
Resizable callbacks
Resizable methods
Resizable tabs
Summary
Chapter 12: The Selectables Component
Basic implementation
Selectee class names
Configurable options of the selectable component
Filtering selectables
Canceling the selection
Selectable callbacks
Working with vast amounts of selectables
Selectable methods
Refreshing selectables
A selectable image viewer
Styling the image selector
Adding the behaviour
Summary
Chapter 13: The Sortables Component
The default implementation
Configuring sortable options
Placeholders
Sortable helpers
Sortable items
Connected lists
Reacting to sortable events
Connected callbacks
Sortable methods
Serializing
Widget compatibility
Adding draggables
Summary
Chapter 14: UI Effects
The core effects file
Using color animations
Using class transitions
Advanced easing
Highlighting specified elements
Additional effect arguments
Bouncing
Shaking an element
Transferring an element's outline
Element scaling
Element explosion
The puff effect
The pulsate effect
Dropping elements onto the page
Sliding elements open or closed
Using easing
The window-blind effect
Clipping elements
Folding elements
Summary
This jQuery
book is from PACKT Publishing, starts with the basics if jQuery UI and drills
down to the depth on how each of the jQuery UI widgets are build. A good
reading to start programming with jquery UI. Each resource is explained with
samples that can be used as templates for your own projects.
What you will learn from this book
How the CSS framework consistently themes the
widgets and how these styles can be used in your own code.What you will learn from this book
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.
Title
|
jQuery UI 1.8: The User Interface Library for jQuery (Imported Edition)
|
Author
|
Dan Wellman
|
Publisher
|
Packt Publishing
|
Publishing
Date
|
2011
|
Pages
|
424
|
Price
|
Rs. 2522/-
|
Price
@ Flipkart
|
Rs. 2068/-
|
Table of Contents
Chapter 1: Introducing jQuery UI
Downloading the library
Setting up a development environment
The structure of the library
ThemeRoller
Component categories
Browser support
Book examples
Library licensing
API introduction
Events and callbacks
Callback arguments
Summary
Chapter 2: The CSS Framework and Other Utilities
The files that make up the framework
jquery.ui.all.css
jquery.ui.base.css
jquery.ui.core.css
The individual component framework files
jquery.ui.theme.css
Linking to the required framework files
Using the framework classes
Containers
Interactions
Icons
Interaction cues
Switching themes quickly and easily
Overriding the theme
The position utility
Using 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
Summary
Chapter 3: Using the Tabs Widget
A basic tab implementation
Tab CSS framework classes
Applying a custom theme to the tabs
Configurable options
Selecting a tab
Disabling a tab
Transition effects
Collapsible tabs
Tab events
Binding to events
Using tab methods
Enabling and disabling tabs
Adding and removing tabs
Simulating clicks
Creating a tab carousel
Getting and setting options
AJAX tabs
Changing the URL of a remote tab's content
Reloading a remote tab
Displaying data obtained via JSONP
Summary
Chapter 4: The Accordion Widget
Accordion's structure
Styling the accordion
Configuring an accordion
Changing the trigger event
Changing the default active header
Filling the height of its container
Accordion animation
Accordion events
Using the change event
The changestart event
Accordion navigation
Accordion methods
Header activation
Resizing an accordion panel
Accordion interoperability
Summary
Chapter 5: The Dialog
Creating a basic dialog
Dialog options
Showing the dialog
The title of the dialog
Modality
Adding buttons
Enabling dialog animations
Configuring the dialog's dimensions
Stacking
Dialog's event model
Controlling a dialog programmatically
Toggling the dialog
Getting data from the dialog
Dialog interoperability
Creating a dynamic image-based dialog
Summary
Chapter 6: The Slider Widget
Implementing a slider
Custom styling
Configurable options
Creating a vertical slider
Minimum and maximum values
Slider steps
Slider animation
Setting the slider's value
Using multiple handles
The range element
Using slider's event API
Slider methods
Practical uses
A color slider
Summary
Chapter 7: The Datepicker Widget
The default datepicker
Configurable options of the datepicker
Basic options
Minimum and maximum dates
Changing the elements in the datepicker UI
Adding a trigger button
Configuring alternative animations
Multiple months
Changing the date format
Updating an additional input element
Localization
Callback properties
Utility methods
Date picking methods
Selecting a date programmatically
Showing the datepicker in a dialog box
An AJAX datepicker
Summary
Chapter 8: The Progressbar Widget
The default progressbar implementation
Progressbar's configuration options
Setting progressbar's value
Progressbar's event API
Progressbar methods
User initiated progress
Rich uploads with progressbar
Summary
Chapter 9: The Button and Autocomplete Widgets
The button widget
Standard implementations
Theming
Configurable options
Button icons
Input icons
Button events
Buttonsets
Checkbox buttonsets
Radio buttonsets
Button methods
The autocomplete widget
Working with local data sources
Using an array of objects as the data source
Configurable autocomplete options
Configuring minimum length
Appending the suggestion list to an alternative element
Autocomplete events
Autocomplete methods
Working with remote data sources
Using a string as the value of the source option
Using a function as the value of the source option
Displaying HTML in the list of suggestions
Summary
Chapter 10: Drag and Drop
The deal with drag and droppables
Draggables
A basic drag implementation
Configuring draggable options
Using the configuration options
Resetting dragged elements
Drag handles
Helper elements
Constraining the drag
Snapping
Draggable event callbacks
Draggable's methods
Droppables
Configuring droppables
Configuring accepted draggables
Tolerance
Droppable event callbacks
Scope
Greedy
Droppable methods
A drag and drop game
Summary
Chapter 11: The Resizable Component
A basic resizable
Resizable options
Configuring resize handles
Adding additional handle images
Defining size limits
Resizing ghosts
Containing the resize
Handling aspect ratio
Resizable animations
Simultaneous resizing
Preventing unwanted resizes
Resizable callbacks
Resizable methods
Resizable tabs
Summary
Chapter 12: The Selectables Component
Basic implementation
Selectee class names
Configurable options of the selectable component
Filtering selectables
Canceling the selection
Selectable callbacks
Working with vast amounts of selectables
Selectable methods
Refreshing selectables
A selectable image viewer
Styling the image selector
Adding the behaviour
Summary
Chapter 13: The Sortables Component
The default implementation
Configuring sortable options
Placeholders
Sortable helpers
Sortable items
Connected lists
Reacting to sortable events
Connected callbacks
Sortable methods
Serializing
Widget compatibility
Adding draggables
Summary
Chapter 14: UI Effects
The core effects file
Using color animations
Using class transitions
Advanced easing
Highlighting specified elements
Additional effect arguments
Bouncing
Shaking an element
Transferring an element's outline
Element scaling
Element explosion
The puff effect
The pulsate effect
Dropping elements onto the page
Sliding elements open or closed
Using easing
The window-blind effect
Clipping elements
Folding elements
Summary
No comments:
Post a Comment