jQuery Fundamentals
2-day Basic jQuery Course for Beginners — JQF
jQuery Web Design Training Course Overview
This jQuery course for beginners, is designed to get non-programmers started with using jQuery to progressively enhance and gracefully degrade website and web application user interfaces (UIs).
Unlike a lot of jQuery training, this course gives as much attention to the issues of when and why to use jQuery, as it does to the mechanics of how to use jQuery. So, for example, when jQuery features overlap with those of CSS3, we'll show you how to use jQuery to support feature-incomplete browsers, without duplicating the built-in CSS3 functionality of advanced browsers.
This jQuery course is particularly suitable for front-end web designers taking their first steps into web programming — because:
- jQuery builds directly upon your existing HTML and CSS knowledge
- jQuery is narrowly scoped — i.e. web-specific, not general-purpose programming
- The course devotes more time for incremental learning and practical exercises — than our intensive 1-day basic jQuery course
This course will not turn you into an expert web programmer overnight, but it will give you some very useful everyday design tools and provide a firm conceptual foundation for learning more generic programming skills in future.
Course contents — 1 Introduction and overview
- What is jQuery?
- What are the alternatives?
- Overview of jQuery features
- Download, install and configure jQuery
- Getting started — a simple jQuery enabled web page
Course contents — 2 Selecting/extracting content
- Basic jQuery selectors
- Form selectors
- Using filters with selectors
- jQuery attribute filters
- jQuery content filters
- jQuery visibility filters
- Traversing the page
- Chaining jQuery statements
- Bringing it all together
Course contents — 3 Content manipulation
- Create and insert new content
- Find and change element attributes
- jQuery insert functions — append-prepend, after-before, etc.
- Functions to remove, wrap or replace content
- Cross-browser CSS styling with jQuery
- Bringing it all together
Course contents — 4 Event handling
- Single (cross-browser) jQuery event object
- jQuery event model — assign handlers to objects by selection
- The
on
andoff
functions — to connect to / disconnect from elements - Click, hover, etc — handy event-related functions
- Common functions on the jQuery event model
- E.g. data, timeStamp, type, target, pageX and pageY, result, stopPropagation, etc.
- Using the
one
method instead ofon
— for one-off events - Trigger and triggerHandler event functions
- Bringing it all together
Course contents — 5 jQuery Animations & effects
- Show, hide and toggle matched elements
- Fade matched elements in, out, and to
- Slide matched elements up, down, toggle — to hide and reveal
- Customised animations — using the animate and stop functions
- Bringing it all together
Course contents — 6 jQuery UI
- Overview — interactions, widgets and effects
- Download, install and configure the jQuery UI plugin
- Interactions — selectable, sortable, draggable, droppable, resizeable
- Widgets — tabs, slider, progress, accordion, datepicker, dialog
- Effects — show, hide, toggle, add class, remove class, toggle class, switch class, color animation
- Using ThemeRoller — build widget themes from off-the-shelf and bespoke components
- Bringing it all together
Course contents — 7 jQuery workshop
- Website upgrade project
- Use jQuery to enhance a pre-built CSS3 website
- jQuery fallbacks for CSS3 animation in non-supporting browsers
- Adding UI features that CSS3 does not provide
- Collapseable sections, tooltips, thumbnailing, slideshow
- Enhanced form design
Dates for Online courses
- €990 Book
Dates for Barcelona
- Thursday 19 Oct 2023 Gran Via de les Corts €990 Book
- Thursday 1 Feb 2024 Gran Via de les Corts €990 Book
Dates for Milan
- Thursday 19 Oct 2023 Brera, Milan €990 Book
- Thursday 1 Feb 2024 Brera, Milan €990 Book
Dates for Rome
- Thursday 23 Nov 2023 Barberini €990 Book
- Thursday 7 Mar 2024 Barberini €990 Book
Dates for Florence
- Thursday 23 Nov 2023 Viale Matteotti €990 Book
- Thursday 7 Mar 2024 Viale Matteotti €990 Book
Dates for Frankfurt
- Thursday 23 Nov 2023 Mainzer Landstrasse €990 Book
- Thursday 7 Mar 2024 Mainzer Landstrasse €990 Book
Dates for Bologna
- Thursday 19 Oct 2023 Stazione Centrale €990 Book
- Thursday 1 Feb 2024 Stazione Centrale €990 Book
Dates for Amsterdam
- Thursday 19 Oct 2023 Schiphol Airport €990 Book
- Thursday 1 Feb 2024 Schiphol Airport €990 Book
Dates for Berlin
- Thursday 19 Oct 2023 Alexanderplatz €990 Book
- Thursday 1 Feb 2024 Alexanderplatz €990 Book
Dates for Paris
- Thursday 19 Oct 2023 République €990 Book
- Thursday 1 Feb 2024 République €990 Book
Dates for Cologne
- Thursday 23 Nov 2023 Deutz Cubus €990 Book
- Thursday 7 Mar 2024 Deutz Cubus €990 Book
Dates for Brussels
- Thursday 19 Oct 2023 Arts-loi / Kunst wet €990 Book
- Thursday 1 Feb 2024 Arts-loi / Kunst wet €990 Book
Dates for Dublin
- Thursday 19 Oct 2023 Ormond Quay €990 Book
- Thursday 1 Feb 2024 Ormond Quay €990 Book
Course Objectives
On completion of this jQuery training course, you should be able to:
- Understand the proper place of jQuery in web design
- Use jQuery alongside HTML, CSS, JavaScript and back-end web programming
- Select, extract, manipulate and insert web content with jQuery
- Use jQuery selectors, filters and functions appropriately
- Use the jQuery event object to handle user-driven and data-driven page events
- Create and manipulate jQuery animations
- Use the jQuery UI library to create and manage widgets, effects and interactions
- Use jQuery and jQuery UI to enhance a pre-existing, non-dynamic, website
Target Audience
- Experienced CSS-based web designers
Training Pre-requisites
The following 2-day WDA training courses — or equivalent knowledge and experience:
Additional knowledge of CSS3 and HTML5 would be helpful, but are not required.
Training Style
This jQuery training course, is instructor-led, but puts more emphasis than usual on hands-on, practical, exercises.
Hands-on practical work may comprise 60%, or more, of class time — depending on the characteristics of your particular training group.