JavaScript & JQuery Introduction (3 days)

This three day Introduction to JavaScript and jQuery assumes no prior knowledge of programming but does assume a good grasp of HTML and CSS. It teaches delegates how to use JavaScript to create modern, interactive web pages. Having learned the basic rules, structure and terminology of JavaScript, delegates will be shown how to leverage these basic skills by using the rich and sophisticated jQuery and jQueryUI libraries for form validation, special effects and the creation of interactive user interfaces.

Course Outline

JavaScript Basics

How to Add JavaScript to a Page, Your First JavaScript Program, Writing Text on a Web Page, Attaching an External JavaScript File, Tracking Down Errors, The Grammar of JavaScript, Statements, Built-In Functions, Types of Data, Variables, Working with Data Types and Variables, Arrays

Adding Logic and Control to Your Programs

Making Programs React Intelligently, Handling Repetitive Tasks with Loops, Functions: Turn Useful Code Into Reusable Commands

Introducing jQuery

About JavaScript Libraries, Getting jQuery, Adding jQuery to a Page, Modifying Web Pages: An Overview, Understanding the Document Object Model, Selecting Page Elements: The jQuery Way, Adding Content to a Page, Setting and Reading Tag Attributes, Reading, Setting, and Removing HTML Attributes, Acting on Each Element in a Selection, Automatic Pull Quotes

Making Pages Come Alive with Events

What Are Events?, Using Events the jQuery Way, More jQuery Event Concepts, Advanced Event Management

Animations and Effects

jQuery Effects, Animations, Performing an Action After an Effect Is Completed, Three. Building Web Page Features

Improving Your Images

Swapping Images, Advanced Gallery with jQuery FancyBox

Improving Navigation

Some Link Basics, Opening External Links in a New Window, Creating New Windows, Opening Pages in a Window on the Page, Basic, Animated Navigation Bar

Enhancing Web Forms

Understanding Forms, Adding Smarts to Your Forms, Form Validation

Expanding Your Interface

Organizing Information in Tabbed Panels, Adding a Content Slider to Your Site, Determining the Size and Position of Page Elements, Adding Tooltips

Introducing Ajax

What Is Ajax?, Ajax: The Basics, Ajax the jQuery Way, JSON

Troubleshooting and Debugging

Top JavaScript Programming Mistakes, Debugging with Firebug