Introduction
Mobile applications come in two basic flavors: native applications, which are compiled programs that run natively on the device, and mobile web applications, which run inside a web browser on the device.
Native applications get almost all of the press these days, especially given the financial success of the iTunes App Store and the Android Market. And with good reason, as native applications have many advantages: they are fast, have access to all of the power of the platform they are built for, and so forth. However, native applications suffer from one important limitation: they are not portable. If you want to make your application available on multiple platforms, you either have to write it in multiple languages (resulting in multiple code bases to maintain) or use a platform abstraction layer like Titanium or PhoneGap.
Mobile web applications, on the other hand, are created in HTML, CSS, and JavaScript, and run in the web browser on the mobile device. This means one code base to maintain, but mobile web applications still need to account for variations in web browsers across platforms.
Enter jQuery Mobile. Based on the popular jQuery JavaScript library, jQuery Mobile is designed to create mobile web applications that function on a broad range of devices. With jQuery Mobile, it is possible to quickly create mobile web applications that look and behave consistently across all supported devices, and that have advanced user interface capabilities. jQuery Mobile gives the developer a standard set of layouts, user interface widgets, and interactions, as well as a rich API for applying and extending them.
jQuery Mobile is not yet in productionas of this writing, it is in its Alpha 4 release, with the beta coming soon.
Even so, the library already has a broad set of features and is remarkably stable. In fact, I have already used it in one production project with great success, and if you review posts on the jQuery Mobile forums, youll see that there are many people using jQuery Mobile in production. As jQuery Mobile advances, we hope to update this ebook to cover new features and provide new tips and techniques.
What This Book Covers
This book covers how the jQuery Mobile library works, and how to use it to create mobile web applications. While I was writing this book I was engaged in a project in which I was using jQuery Mobile to create a mobile web application. This gave me a unique insight into how to use jQuery Mobile in a production environment, so this book takes a practical approach for using the library and focuses on example code and screenshots. In addition, throughout the book there are Under The Hood sections where I explore a topic in more detail: page initialization, using swipe events to trigger page transitions, animation in a jQuery Mobile application, and so forth.
In , we will provide a high-level overview of jQuery Mobile, how it works, and how to use it. If you follow the examples in the chapter, at the end of the chapter you will have built your first jQuery Mobile application. It wont do much, but it will show how easy it is to set up a jQuery Mobile application and introduce you to some important jQuery Mobile concepts.
covers paging and navigation in jQuery Mobile, including dialogs, AJAX content, and history.
In , we will cover the UI elements that jQuery Mobile can create: toolbars, buttons, lists, form elements, and layout grids.
In , we will cover the jQuery Mobile theme framework, how to use it, and how to customize it.
In , we will take a look at the new events that jQuery Mobile creates, the methods it exposes, and how to customize jQuery Mobile for your own applications.
is where we will put everything together and build an actual mobile application: jqmTweet. Well walk through how to approach building a mobile application with jQuery Mobile from start to finish.
What You Need To Know
This book assumes you are already familiar with the jQuery JavaScript library. You should be able to create jQuery selectors and apply jQuery methods to them.
This book assumes you are familiar with HTML markup and Cascading Style Sheets. Throughout the code examples, we will be using HTML 5 and CSS 3, and employing industry best practices like semantic markup and progressive enhancement.
This book also assumes that you have a basic familiarity with mobile web browsers. Though jQuery Mobile aims to provide a cross-platform API, it is still necessary for a mobile web developer to understand mobile browsers and their capabilities.
Finally, this book assumes you are familiar with the technologies of the web: HTTP, clients and servers, security, etc.
Conventions Used In This Book
The following typographical conventions are used in this book:
ItalicIndicates a term, URL, email address, or filenames or extensions.
Constant Width
Used for code examples and for code elements such as variable names, function names, keywords, etc. that are included in regular paragraphs.
Constant width italic
Shows text that should be replaced with user-supplied values or by values determined by context.
Note
This signifies a tip, suggestion, or note of interest.
Warning
This indicates a warning or caution: a bug in the library, a common problem, etc.
Using Code Examples
This book is here to help you get your job done. In general, you may use the code in this book in your programs and documentation. You do not need to contact us for permission unless youre reproducing a significant portion of the code. For example, writing a program that uses several chunks of code from this book does not require permission. Selling or distributing a CD-ROM of examples from OReilly books does require permission. Answering a question by citing this book and quoting example code does not require permission. Incorporating a significant amount of example code from this book into your products documentation does require permission.
We appreciate, but do not require, attribution. An attribution usually includes the title, author, publisher, and ISBN. For example: jQuery Mobile by Jon Reid (OReilly). Copyright 2011 Jonathan Reid, 978-1-449-30668-7.
If you feel your use of code examples falls outside fair use or the permission given above, feel free to contact us at .