JQuery UI provides abstractions for low-level interaction and animation, advanced effects, and high-level ‘widgets’. This JQuery UI training course guides you through various features of the JQuery UI library, and shows how to use them to build highly interactive web applications.
Course Agenda:
- Introduction – Why use JQuery ?
- Referencing a JQuery Script
- Using Content Delivery Networks
- Using the JQuery Ready Function
- Getting to Know the JQuery Documentation
- Using JQuery Selectors
- What are Selectors?
- Selecting Nodes by Tag Name
- Selecting Nodes by ID
- Selecting Nodes by Class Name
- Selecting Nodes by Attribute Value
- Selecting Input Nodes
- Additional Selector Features
- Interacting with the DOM
- Introduction
- Iterating Through Nodes
- Modifying Properties and Attributes
- Adding and Removing Nodes
- Modifying Styles
- Modifying Classes
- Handling Events (Overview)
- Introduction
- JQuery Event Model Benefits
- Handling Events
- Binding to Events
- live() and Participant()
- Handling Hover Events
- Working with Ajax Features (Overview)
- JQuery Ajax Functions
- Loading HTML Content from the Server
- Making GET Requests Making POST Requests
- Introduction to the ajax() Function
- Advanced Animations
- Animating with CSS
- Color animation
- Easing
- Bouncy Content Panes
- Animation Queues
- Chaining Actions
- Animating Navigation
- JQuery User Interface (UI) Library
- Handling User Scrolling
- The scroll event
- Floating navigation
- Scrolling the document
- Customizing scroll bars
- Handling Resizing
- The resize event
- Layout switcher
- Resizable elements (textarea, plane splitter)
- Images and Slideshows
- Building our own lightbox
- Using ColorBox plugin
- Cropping images with jCrop plugin
- Slideshows
- Faders (cross, rollover)
- Timers
- Using Cycle plugin
- Scrolling
- Thumbnails
- Customizing events that trigger scrolling
- Menus
- Expandable and collapsible menus
- Open-closed indicators
- Expand on hover
- Hover intents
- Drop-down menus
- Accordion menus
- Simple
- Multi-level
- JQuery UI Accordion
- Tabs
- Basic tabs
- JQuery UI tabs
- Tab options and controls
- Panels and Panes
- Slide-downs
- Sliding overlay