O'Reilly logo

Stay ahead with the world's most comprehensive technology and business learning platform.

With Safari, you learn the way you learn best. Get unlimited access to videos, live online training, learning paths, books, tutorials, and more.

Start Free Trial

No credit card required

Learning jQuery UI

Video Description

In this jQuery UI training course, expert author Dan Wellman will teach you how to navigate the jQuery user interface interactions, effects, widgets, and themes that are built on top of the jQuery JavaScript library. This course is designed for the intermediate user that already has a working knowledge of HTML, CSS and JavaScript to design websites.
You will start by learning about the jQuery UI core and utilities, such as the core methods and selectors and the position utility. You will then learn about the various widgets available in the UI, including the accordion, progressbar, tabs, button, slider, tooltip, spinner, dialog, autocomplete, and datepicker widget. Once you have mastered the widgets, Dan teaches you about the themable CSS framework in jQuery UI. This video tutorial will also teach you about the interactions in jQuery UI, including selectable, resizable, draggable, droppable, and sortable. Finally, you will learn about the UI effects, such as color animations, class transitions, and how to show and hide effects.
By the completion of this computer based training course, you will be fully capable of building complete interactive web applications using the jQuery UI toolset. Working files are included, allowing you to follow along with the author throughout the lessons.

Table of Contents

  1. Getting Started
    1. Introduction To jQuery UI 00:02:11
    2. Downloading jQuery UI 00:04:10
    3. What This Course Will Teach You 00:02:34
    4. About The Author 00:02:17
    5. How To Access Your Working Files 00:01:15
  2. jQuery UI Core
    1. Core Methods 00:04:39
    2. Core Selectors 00:03:48
    3. Method Overrides 00:02:53
  3. Common/Shared API
    1. Shared API Methods 00:03:31
    2. Shared API Configuration Options 00:02:28
    3. Shared API Events 00:02:12
  4. jQuery UI Utilities
    1. The Position Utility 00:03:34
    2. Easings 00:02:30
  5. The Accordion Widget
    1. Introduction To The Accordion Widget 00:01:53
    2. Accordion Configuration Options 00:03:27
    3. Accordion Events 00:04:22
  6. The Progress Bar Widget
    1. Introduction To The Progress Bar Widget 00:03:01
    2. Progress Bar Configuration Options 00:04:22
    3. Progress Bar Events 00:02:46
  7. The Tabs Widget
    1. Introduction To The Tabs Widget 00:01:32
    2. Tabs Configuration Options 00:05:02
    3. Loading Tab Content 00:03:51
    4. Tabs Events 00:04:39
  8. The Button Widget
    1. Introduction To The Button Widget 00:02:56
    2. Button Configurable Options 00:04:07
  9. The Slider Widget
    1. Introduction To The Slider Widget 00:01:44
    2. Slider Configuration Options 00:02:19
    3. Working With Multiple Slider Handles 00:01:50
    4. Slider Events 00:03:18
  10. The Tooltip Widget
    1. Introduction To The Tooltip Widget 00:02:49
    2. Tooltip Content 00:03:42
    3. Tooltip Positioning 00:03:17
    4. Tooltip Animations 00:02:36
  11. The Menu Widget
    1. Introduction To The Menu Widget 00:02:48
    2. Menu Configuration Options 00:02:48
    3. Opening And Closing Menus 00:03:39
    4. Menu Events 00:01:58
  12. The Spinner Widget
    1. Introduction To The Spinner Widget 00:01:56
    2. Basic Configuration Options 00:02:27
    3. Spinner Interaction - Stepping 00:01:57
    4. Spinner Interaction - Paging 00:02:04
    5. Extending Spinner 00:03:24
  13. The Dialog Widget
    1. Introduction To The Dialog Widget 00:01:59
    2. Dialog Configuration Options 00:02:31
    3. Dialog Methods 00:02:47
    4. Dialog Positioning 00:02:13
    5. Dialog Dimensions 00:02:02
    6. Dialog Buttons 00:01:36
    7. Dialog Events 00:03:01
  14. The Auto-Complete Widget
    1. Introduction To The Auto-Complete Widget 00:02:23
    2. Auto-Complete Configuration Options 00:02:07
    3. Searching Programmatically 00:01:53
    4. Auto-Complete Events 00:02:21
    5. Extending Auto-Complete 00:04:36
  15. The Datepicker Widget
    1. Introduction To The Datepicker Widget 00:01:49
    2. Datepicker Configuration Options 00:03:25
    3. Showing And Hiding The Datepicker 00:03:24
    4. Opening With A Trigger Button 00:02:22
    5. Handling Date Formats 00:02:23
    6. Min And Max Dates 00:02:45
    7. Datepicker Utility Functions 00:04:46
    8. Internationalization 00:02:58
  16. jQuery UI Theming
    1. The Themable CSS Framework 00:02:57
    2. Themeroller 00:03:28
  17. Selectable Interaction
    1. Introduction To Selectable Interaction 00:01:55
    2. Selectable Configuration Options 00:02:26
    3. Selectable Filtering 00:02:15
    4. Select Events 00:02:17
  18. Resizable Interaction
    1. Introduction To Resizable Interaction 00:01:39
    2. Resizable Configuration Options 00:04:17
    3. Resizable Size Constraints 00:02:43
    4. Resize Events 00:01:42
  19. Draggable Interaction
    1. Introduction To Draggable Interaction 00:01:23
    2. Draggable Configuration Options 00:02:58
    3. Draggable Confinement 00:02:23
    4. Draggable Snapping 00:02:24
    5. Draggable Events 00:02:05
  20. Droppable Interaction
    1. Introduction To Droppable Interaction 00:01:53
    2. Droppable Configuration Options 00:02:29
    3. Drop Events 00:02:17
  21. Sortable Interaction
    1. Introduction To Sortable Interaction 00:01:49
    2. Sortable Configuration Options 00:03:03
    3. Sortable Containment 00:01:44
    4. Sortable Events 00:02:09
    5. Getting The Sort Order 00:02:16
  22. UI Effects
    1. Introduction To UI Effects 00:01:34
    2. Color Animations 00:01:24
    3. Class Transitions 00:02:33
    4. Show And Hide Effects 00:02:44
    5. Other Effects 00:01:58
  23. jQuery UI Widget Factory
    1. Creating The Widget Shell 00:05:23
    2. Adding Support For Common API Methods 00:03:15
    3. Custom Methods 00:03:04
    4. Custom Events 00:02:20
  24. Conclusion
    1. Wrap Up 00:02:26