• Technical IT

    Solutions delivered throughout the UK
  • Business Applications

    Solutions delivered throughout the UK
  • Professional Best Practice

    Solutions delivered throughout the UK
  • Professional Development

    Solutions delivered throughout the UK

jQuery Mobile

jQuery Mobile
  • Price £997.00
  • Level Introduction
  • Duration 5 day(s)
All major credit cards accepted

Description

In this class, you will learn how to develop client side user interface for smart phones and tablets.

Prerequisites

jQuery Mobile training is designed for UI designers and developers

Assumed Knowledge

  • HTML 4 / XHTML knowledge
  • JavaScript basic preferred
  • jQuery basic preferred
  • CSS basic preferred

Skills

By the end of jQuery Mobile training, you should be able to develop relatively complex user interfaces for mobile devices all by yourself.

Course Content

The Background

  • The mobile space today
  • Advantages
  • Challenges
  • Native vs. web, is really a question?
  • What is JQM?
  • What is not jQM?
  • What is a webapp?
  • Why jQM?
  • Features
  • Compatibility
  • Requirements

HTML5 basics

  • HTML5 in a small nutshell
  • Why HTML5?
  • What do we need to know about HTML5 for jQM
  • Basic template
  • Testing HTML5 documents
  • Emulators, Simulators & more
  • Viewports on mobile browsers
  • Custom data-* attributes

The framework

  • Architecture
  • Self hosted vs. CDNs
  • CDNs available
  • Main template
  • Support on IDEs
  • Roles
  • Theming

The page

  • Headers and footers basics
  • Mandatory items in a page
  • Working with HTML in the content
  • Navigation
  • Internal page navigation
  • External page navigation
  • Understanding AJAX on mobile browsers
  • Absolute external links
  • Mobile Special links
  • Transitions
  • Dialogs
  • Prefetching
  • Integration with the Phone

UI Components

  • Customizing toolbars
  • Positioning toolbars
  • Navigation Bars
  • Persistent footers and navigation
  • Collapsible content
  • Acoordions
  • Working with columns

Buttons

  • Creating buttons
  • Inline buttons
  • Grouped buttons
  • Icons
  • Custom icons

Lists

  • Creating lists
  • Full-page vs inset-lists
  • Visual separators
  • Nested lists
  • Interactive rows
  • Split button rows
  • Row icons
  • Thumbnails
  • Count bubbles
  • Aside content
  • Title and Description
  • Filtering data

Forms

  • AJAX vs. non-AJAX forms
  • Automatic form behaviour
  • Labeling
  • Field containers
  • Text fields
  • Slider
  • Slider switch
  • Select menus
  • UI Select menus
  • Radio Buttons
  • Checkboxes
  • File Upload
  • Validation using HTML5

The framework and JavaScript

  • Using jQuery inside jQuery Mobile
  • $.mobile element
  • The mobileinit event
  • Configuring defaults
  • Touch events
  • Orientation events
  • Scroll events
  • Page events
  • Virtual mouse events
  • Managing navigation through JavaScript

Dynamic data with jQuery Mobile

  • HTML5 vs AJAX
  • Bringing JSON data to jQuery Mobile
  • Updating form controls
  • Updating lists
  • Implementing Infinite list pattern

Extending the framework

  • Using plugins
  • The top 5 plugins for jQuery Mobile
  • Creating our own plugin
  • Plugin architecture
  • Understanding CSS architecture
  • Define our own CSS patch
  • Changing CSS behavior

Managing data with HTML5

  • Using Web Storage and WebSQL
  • Using geolocation

Packaging for installation and stores

  • The offline manifest
  • Full-screen webapps for iOS
  • What is a hybrid
  • PhoneGap vs other alternatives
  • Packaging a sample application

Make Enquiry

Course Enquiry
  •  
  •  

Book Now

Course Enquiry
  •  
  •  

Find your local training centre