RKCP Information Technology




JQuery
Home » Courses   » JQuery

JQuery

Learn jQuery Introduction, Handling User Scrolling, Handling Resizing, AJAX With Jquery, Forms, Controls, Dialogs And Notifications, Advanced Jquery in jQuery Tutorial/Training-LIVE Online & Classroom sessions

Overview

This course teaches the participants how to tap into the power of jQuery to build extremely rich yet elegant Web UIS using one of the simplest and most popular cross-browse Javascript Libraries.


Objective

At the end of jQuery training course, the participants will:

  • Understand what's so good about jQuery
  • Be able to add support for jQuery into their own UIs
  • Get how jQuery works: DOM selection, decoration, enhancing
  • Be able to use jQuery's effects, animation, scrolling, and resizing capabilities
  • Be able to render pro-looking panels, menus (including drop-down), accordions, tabs, tooltips UI widgets in their applications
  • Learn about jQuery's AJAX facilities and create amazing interactive applications
  • Be able to enhance your forms with hints, autosuggestions, client-side validation, star ratings and more
  • Understand jQuery's plugins, themes, and other advanced concepts, including best-practices

Suggested Audience - Web developer who wants to build best-of-breed web UIs with the simplicity and elegance of jQuery.

Duration - 2 Days


Prerequisites

Must Have

,
    ,
  • Web development experience with HTML, CSS & JavaScript
  • ,
,

Good To Have

,
    ,
  • Exposure to any server technology (J2EE, .NET, Ruby etc)
  • ,


Syllabus

Expand All
  • 1. Overview of jQuery
    • What's jQuery and what's so good about it?
    • Who is using it?
    • Cross-browser compatibility
    • jQuery UI and Plugins
  • 2. Getting started with jQuery
    • Downloading and including jQuery
    • Google and Microsoft CDN
    • Developer vs. Production versions (compressed v/s uncompressed)
    • jQuery namespace and jQuery '$' alias
    • Revisiting HTML DOM
    • Debugging jQuery problems
  • 3. 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
  • 4. Handling User Scolling
    • The scroll event
    • Floating navigation
    • Scrolling the document
    • Customizing scroll bars
  • 5. Handling Resizing
    • The resize event
    • Layout switcher
    • Resizable elements (text area, plane splitter)
  • 6. 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
  • 7. Forms
    • Simple form validation
    • The submit event
    • Validation plugin
    • Form hints
  • 8. Controls
    • Date picker - Date validation -
    • Sliders
    • Drag and drop
    • Sorting with jQuery UI's sortable
    • Progress bar
  • 9. Dialogs and Notifications
    • Simple modal dialog
    • jQuery UI dialog
    • Growl-style notifications
    • 1-up notification
  • 10. Advanced Concepts
    • Best Practices
    • Clean code
    • Comments
    • Map objects
    • Name spacing
    • Scoping
    • Client-side templating
    • Why browser-sniffing should be avoided
    • Feature detection - Plugins - tExtending jQuery - tCoexisting with other JavaScript libraries (like prototype.js) - tQueing and dequeuing animations - tThemes - tBuilding custom themes using the Theme builder -