Tài liệu hạn chế xem trước, để xem đầy đủ mời bạn chọn Tải xuống
1
/ 247 trang
THÔNG TIN TÀI LIỆU
Cấu trúc
Cover
Copyright
Credits
About the Authors
About the Reviewers
www.PacktPub.com
Table of Contents
Preface
Chapter 1: Preparing your First jQuery Mobile Project
Important preliminary points
Building an HTML page
Getting jQuery Mobile
Implementing jQuery Mobile
Working with data attributes
Summary
Chapter 2: Working with jQuery
Mobile Pages
Important preliminary points
Adding multiple pages to one file
jQuery Mobile, links, and you
Working with multiple files
jQuery Mobile and URLs
Additional customization
Page titles
Prefetching content
Changing page transitions
Summary
Chapter 3: Enhancing Pages
with Headers, Footers,
and Toolbars
Important preliminary points
Adding headers
Icon sneak peak
Working with back buttons
Working with footers
Creating fixed and full screen headers and footers
Full screen positioning
Working with navigation bars
Persisting navigation bar footers across multiple pages
Summary
Working with Lists
Creating lists
Working with list feature
Creating Inset lists
Creating list dividers
Creating lists with count bubbles
Using thumbnails and icons
Creating Split Button lists
Using a search filter
Summary
Chapter 5: Getting Practical – Building a Simple Hotel Mobile Site
Welcome to the Hotel Camden
The home page
Finding the hotel
Listing the hotel rooms
Contacting the hotel
Summary
Chapter 6: Working with Forms and jQuery Mobile
Before you begin
What jQuery Mobile does with forms
Working with radio buttons and checkboxes
Working with select menus
Search, toggle, and slider fields
Search fields
Flip toggle fields
Slider fields
Using native form controls
Working with "mini" fields
Summary
Chapter 7: Creating Modal Dialogs, Grids, and Collapsible Blocks
Creating dialogs
Laying out content with grids
Working with collapsible content
Summary
Chapter 8: jQuery Mobile Configuration, Utilities, and JavaScript methods
Configuring jQuery Mobile
Using jQuery Mobile utilities
Page methods and utilities
Path and URL related utilities
Miscellaneous utilities
jQuery widget and form utilities
Summary
Chapter 9: Working with Events
Working with physical events
Handling page events
What about $(document).ready?
Creating a real example
Summary
Chapter 10: Moving further
with the Notekeeper
Mobile Application
What is a mobile application?
Designing your first mobile application
Listing out the requirements
Building your wireframes
Designing the add note wireframe
Display notes wireframe
View note/delete button wireframe
Writing the HTML
Adding functionality with JavaScript
Storing Notekeeper data
Using localStorage
Effective use of boilerplates
Building the Add Note feature
Adding bindings
Collecting and storing the data
Building the Display Notes feature
Dynamically adding notes to our listview
Viewing a note
Using the Live function
Dynamically creating a new page
Deleting a note
Summary
Chapter 11: Enhancing jQuery Mobile
What's possible?
The visual building blocks of
jQuery Mobile
Border-radius
Applying drop shadows
Using text-shadow
Using box-shadow
CSS gradients
The basics of jQuery Mobile theming
Bars (.ui-bar-?)
Content blocks (.ui-body-?)
Buttons and listviews (.ui-btn-?)
Mixing and matching swatches
Site-wide active state
Default icons
Creating and using a custom theme
What's ThemeRoller?
Using ThemeRoller
Preview
Colors
Inspector
Tools
Creating a theme for Notekeeper
Exporting your theme
Creating and using custom icons
CSS Sprites
Designing your first icon
High and low resolution
Updating the Notekeeper app
Adding our custom theme
Adding our custom icon
Summary
Chapter 12: Creating Native Applications
HTML as a native application
Working with PhoneGap
Adding PhoneGap functionality
Summary
Chapter 13: Becoming an expert - Build an RSS Reader application
RSS Reader – the application
Creating the RSS Reader Application
The displayFeeds function
Storing our feeds
Adding an RSS feed
Viewing a feed
Creating the entry view
Going further
Summary
Index
Nội dung
[...]... users, built using jQueryMobile Not surprisingly, this website too uses jQuery Mobile, which makes it yet another way to sample jQuery Mobile: [4] Preface What this book covers Chapter 1, Preparing your First jQueryMobile Project, works you through your first jQueryMobile project It details what must be added to your project's directory and source code Chapter 2, Working with jQueryMobile Pages, continues... Preparing your First jQueryMobile Project 11 Important preliminary points 11 Building an HTML page 11 Getting jQueryMobile 13 Implementing jQueryMobile 14 Working with data attributes 16 Summary 18 Chapter 2: Working with jQueryMobile Pages 19 Important preliminary points 19 Adding multiple pages to one file 20 jQuery Mobile, links, and you 22 Working with multiple files 23 jQueryMobile and URLs 26... true mobile apps with jQuery Mobile, it's definitely an option Help! While we'd like to think that this book will cover every single possible topic you would need for all your jQueryMobile needs, most likely there will be things we can't cover If you need help, there are a couple of places you can try First, the jQueryMobile docs (http://jquerymobile.com/demos/1.0/), cover syntax, features, and development. .. will do our best to address it [9] Preparing your First jQueryMobile Project You know what jQueryMobile is, the history of it as well as its features and goals Now we're actually going to build our first jQueryMobile website (well, web page) and see how easy it is to use In this chapter we will: • • • • Create a simple HTML page Add jQueryMobile to the page Make use of custom data attributes (data-*)... chapter, we talked a bit about how web pages may not always render well in a mobile browser We talked about how the simple use of jQueryMobile can go a long way to improving the mobile experience for a website Specifically, we discussed how you can download jQueryMobile and add it to an existing HTML page, what data attributes mean in terms of HTML, and how jQueryMobile makes use of data attributes... required (While jQueryMobile uses a lot of CSS and JavaScript behind the scenes, you don't actually have to write any of this yourself!) What about native apps? jQueryMobile does not create native applications You'll see later in the book how you can combine jQueryMobile with wrapper technologies such as PhoneGap to create native apps but, in general, jQueryMobile is for building websites The question... jQueryMobile application Chapter 6, Working with Forms and jQuery Mobile, explains the process of using jQueryMobile optimized forms Layout and special form features are covered in detail Chapter 7, Creating Modal Dialogs, Grids, and Collapsible Blocks, walks you through special jQueryMobile user interface items for creating grid based layouts, dialogs, and collapsible content areas Chapter 8, jQuery. .. [ iv ] Preface What is jQuery Mobile? On August 11, 2010, nearly two years ago, John Resig (creator of jQuery) announced the jQueryMobile project While focused on the UI framework, it was also a recognition of jQuery itself as a tool for mobile sites and that work would be done to the core framework itself, to make it work better on devices Release after release, the jQueryMobile project evolved... a mobile simulator: Wow, that's pretty tiny You've probably seen web pages like this before on your mobile device You can, of course, typically use pinch and zoom or double click actions to increase the size of the text But it would be preferable to have the page render immediately in a mobile friendly view This is where jQueryMobile enters Getting jQueryMobile In the preface we talked about how jQuery. .. help Second, the jQueryMobile forum (http://forum .jquery. com /jquery- mobile) , is an open ended discussion list for jQueryMobile topics This is the perfect place to ask questions Also, it's a good place to learn about problems other people are having You may even be able to help them One of the best ways to learn a new topic is by helping others [3] Preface Examples Want to see jQueryMobile in action? . really help.
Second, the jQuery Mobile forum (
http://forum .jquery. com /jquery- mobile) ,
is an open ended discussion list for jQuery Mobile topics. This is. Preparing your First jQuery Mobile Project 11
Important preliminary points 11
Building an HTML page 11
Getting jQuery Mobile 13
Implementing jQuery Mobile 14
Working