Book Image

jQuery Mobile Web Development Essentials - Third Edition

By : Raymond Camden, Andy Matthews
Book Image

jQuery Mobile Web Development Essentials - Third Edition

By: Raymond Camden, Andy Matthews

Overview of this book

jQuery Mobile is a HTML5-based touch-optimized web framework. jQuery Mobile can be used to build responsive cross-platform websites and apps for a wide range of smartphones, tablets, and desktop devices. The jQuery Mobile framework can be integrated with other mobile app frameworks such as PhoneGap, IBM Worklight, and more. Introduction to jQuery Mobile explains how to add the framework to your HTML pages to create rich, mobile-optimized web pages with minimal effort. You’ll learn how to use jQuery Mobile’s automatic enhancements and configure the framework for customized, powerful mobile-friendly websites. We then dig into forms, events, and styling. You'll see how jQuery Mobile automatically enhances content, and will find out how to use the JavaScript API to build complex sites. We’ll introduce you to how jQuery Mobile can be themed as well looking into how JavaScript can be used for deep sets of customizations. The examples are ready to run and can be used to help kick-start your own site. Along the way, you will leverage all the concepts you learn to build three sample mobile applications.
Table of Contents (20 chapters)
jQuery Mobile Web Development Essentials Third Edition
About the Authors
About the Reviewer

Working with back buttons

Depending on your user's hardware, they may or may not have a physical back button. For devices that do, such as Android phones, hitting the back button will work just fine in a jQuery Mobile application. Whichever page the user was on previously will be loaded as soon as the button is clicked. But on other devices, such as the iPhone, there is no such button to click. While you can provide links to navigate around pages yourself, jQuery Mobile provides some nice built-in support for navigating backwards out of the box.

There are two ways you can add an automatic back button. The code in Listing 3-4 shows a simple two-page jQuery Mobile website. In the second page, we've added a new data attribute, data-add-back-btn="true". This will create a Back button in the header of the second page automatically. Next, we also added a simple link in the page content. While the actual URL of the link is blank, make note of the data-rel="back" attribute. jQuery Mobile will detect...