Our Web Development with jQuery course teaches you how to tap into the power of jQuery to build extremely rich, yet elegant web UIs using one of the most simple and popular cross-browser JavaScript libraries out there.

Not only will you learn by doing, but you'll have a lot of fun along the way because jQuery is all about instant gratification!

Call +94777337279  Email This email address is being protected from spambots. You need JavaScript enabled to view it.

Overview of jQuery

  • What's jQuery and what's so good about it?
  • Who is usng it?
  • Cross-browser compatibility
  • jQuery UI and Plugins

Getting Started with jQuery

  • Downloading and including jQuery
  • Google and Microsoft CDN
  • Developer vs. Production versions (compressed vs uncompressed)
  • jQuery namespace and jQuery '$' alias
  • Revisiting HTML DOM
  • Debugging jQuery problems
  • Accessibility concerns

Using jQuery

  • Making sure that the page is ready
  • Selections using CSS3
    • Filters
    • Multiple item selectors
    • Best practices
  • Decorating with CSS
    • Changing styles
    • Adding/removing classes
  • Effects with jQuery (e.g. hiding, revealing, and toggling elements)
    • Basic Animations
    • Callback functions
  • Event handlers
  • Adding and removing HTML elements
  • Modifying content

Advanced Animations

  • Animating with CSS
  • Color animation
  • Easing
  • Bouncy Content Panes
  • Animation Queues
  • Chaining Actions
  • Animating Navigation
  • jQuery User Interface (UI) Library

Handling User Scolling

  • 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

Tooltips

  • Simple
  • Advanced (using sprites)

Ajax with jQuery

  • Overview of Ajax
  • Loading content asynchronously
  • Fetching JSON data
  • jQuery's .ajax facilities
    • Common settings
    • GET and POST requests
    • Ajax Events
    • Consuming XML
    • Sending HTML form data
  • Loading external scripts dynamically
  • Interactive Ajax
  • Spinners and progress indicators
  • Endless scrolling

Forms

  • Simple form validation
  • The submit event
  • Validation plugin
  • Form hints
  • Checkbox checker
  • Inline editing
  • Autocomplete
  • Star rating input

Controls

  • Date picker
    • Date validation
  • Sliders
  • Drag and drop
  • Sorting with jQuery UI's sortable
  • Progress bar

Dialogs and Notifications

  • Simple modal dialog
  • jQuery UI dialog
  • Growl-style notifications
  • 1-up notification

jQuery Widgets

  • Lists
    • jQuery UI selectables
    • Sorting
    • Swapping list elements
    • Searching
    • Selecting
  • Trees
    • Expandable/collapsable trees
    • Event delegation
  • Tables
    • Fixed headers
    • Repeating headers
    • Data grids
    • Pagination
    • Row editing
    • DataTables plugin
    • Selecting rows and columns

Advanced Concepts

  • Best Practices
    • Clean code
    • Comments
    • Map objects
    • Namespacing
    • Scoping
    • Client-side templating
    • Why browser-sniffing should be avoided
    • Feature detection
  • Plugins
  • Extending jQuery
  • Creating your own selectors
  • Events
  • The special event
  • Coexisting with other JavaScript libraries (like prototype.js)
  • Queing and dequeuing animations
  • Themes
  • Parting thoughts