Introduction to jQuery

jQuery is a JavaScript library that has standardized and simplified the browser language for all browsers when possible. The course teaches how to use jQuery to develop the web page logic behind animation, HTML5 features, DOM manipulations, menus, better form control, and more. It does not focus on teaching traditional programming concepts or the basics of JavaScript but the student will slowly pick up those through the use of jQuery.

Retail Price: $1,650.00

Next Date: Request Date

Course Days: 3


Request a Date

Request Custom Course


About This Course

jQuery is a JavaScript library that has standardized and simplified the browser language for all browsers when possible. The course teaches how to use jQuery to develop the web page logic behind animation, HTML5 features, DOM manipulations, menus, better form control, and more. It does not focus on teaching traditional programming concepts or the basics of JavaScript but the student will slowly pick up those through the use of jQuery.

Audience Profile

Anyone who would like to start enhancing their basic to advanced web pages with JavaScript but doesn't want to spend the time to learn programming

At Course Completion

The student will have learned what effects and features can be implemented on web pages with DOM manipulation through jQuery commands as well as how to install and use most jQuery plug-ins.


Course Outline

Intro to jQuery

  • What’s so good?
  • What the downside?
  • Downloading jQuery
  • Uncompressed or compressed?
  • The jQuery alias
  • Dissecting a jQuery statement
  • JavaScript vs jQuery objects
  • Bits of HTML
  • Debugging

Selecting, Decorating, and Enhancing

  • Making sure the page is ready
  • Simple selecting / narrowing down
  • Testing our selection
  • Filters
  • Selecting multiple elements / traversing
  • Reading CSS
  • Setting CSS properties
  • Classes
  • Enhancing
  • Event handlers
  • Event handlers - common
  • Event handlers - 1.7
  • Revealing hidden elements
  • Toggling elements
  • Progressive enhancement
  • Adding new elements
  • Removing existing elements
  • Modifying content
  • Applying effect to each element of a collection
  • Basic animation
  • Slide effects
  • Anonymous functions
  • A few tricks
  • Spoiler revealer

Animating, Scrolling, and Resizing

  • Animating
  • Color animation
  • Easing
  • Advanced easing
  • Bouncy content panes
  • The animation queue
  • Animation functions
  • Chaining actions
  • Animated navigation
  • Animated navigation, Take 2
  • The jQuery UI library
  • Scrolling
  • Floating navigation
  • Scrolling the document
  • Custom scroll bars
  • Advanced scrolling
  • Resizing
  • Resizable elements
  • ThemeRoller
  • Pane splitter

Images and Slideshows

  • Lightboxes
  • attr( )
  • load( )
  • Event handlers in options/maps
  • Troubleshooting
  • Cropping images with Jcrop
  • Slideshows
  • JavaScript timers
  • Stopping timers
  • Fading slideshow
  • True cross-fading
  • Plugins
  • Scrolling slideshows
  • Scrolling slideshows
  • Smarter scrolling with data( )
  • Object notation

Menus, Tabs, Tooltips, and Panels

  • Menus
  • Event propagation
  • Default event actions
  • Open / closed indicators
  • Menu expand on hover
  • Drop-down menus
  • Accordion menus
  • Tabs
  • Panels and panes
  • Sliding overlay
  • Tooltips
  • Tooltips
  • Advanced tooltips

Construction, Ajax, and Interactivity

  • Cleaner jQuery
  • Client-side templating
  • Browser sniffing
  • AJAX crash course
  • Loading remote HTML
  • Enhancing hyperlinks
  • Picking HTML with selectors
  • Advanced loading
  • Prepare for the future
  • Fetching data
  • Delicious
  • Twitter
  • Twitter plugins
  • Flickr
  • The jQuery Ajax workhorse
  • Common Ajax settings
  • Loading external scripts
  • GET and POST requests
  • jQuery Ajax events
  • Interactivity: Using Ajax

Forms, Controls, and Dialogs

  • Forms
  • Form selectors
  • Simple validation scripts
  • Designing form validation
  • The submit event
  • Form validation with the plugin
  • Version and script links
  • HTML
  • jQuery
  • Unobtrusive JavaScript
  • CSS
  • View current source code
  • Validation predefined rules
  • Maximum length indicator
  • Form hints
  • Check all checkboxes
  • Inline editing
  • Autocomplete
  • Star rating control
  • Form & validation plugins
  • Controls - date pickers
  • Controls - quick theme
  • Sliders
  • Drag and drop
  • Sortable
  • Progress bar
  • Dialogs and notifications
  • jQuery UI Dialog
  • Growl-style notifications
  • 1-up notifications

Lists, Trees, and Tables

  • Lists & new functions
  • New functions
  • Utility functions - map, makeArray
  • text( ), val( ), html( )
  • find( ), children( )
  • sort( )
  • filter( ), indexOf( )
  • Trees
  • Event delegation
  • on( ), off( ) - 1.7
  • Tables & pagination

Plugins, Themes, and Advanced Topics

  • Creating a plugin
  • Executing a plugin
  • Adding options (args)
  • Executing with options
  • Adding callbacks to options
  • Extending jQuery
  • $. prefixed functions
  • Overwriting functions
  • Create your own selectors
  • Events
  • Custom events
  • Unbinding
  • Namespacing
  • new events / special
  • Avoiding conflicts
  • Queuing/dequeuing animations
  • JavaScript objects as jQuery objects
  • Theme rolling
  • Using themes

Resources

  • Web sites
  • Conferences
  • Plug-ins


Sorry! It looks like we haven’t updated our dates for the class you selected yet. There’s a quick way to find out. Contact us at 502.265.3057 or email info@training4it.com


Request a Date