February 2012
Beginner to intermediate
272 pages
6h 20m
English
Content preview from jQuery Mobile: Up and Running
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.
Chapter 7. Creating Themes
jQuery Mobile allows us to customize the entire user interface through themes and CSS. We need to remember that jQuery Mobile generates HTML and CSS so every feature can be overridden using CSS.
In Figure 7-1, we can see some jQuery Mobile websites with different user interfaces. If you want to see more of these customized UI websites, you can check http://jqmgallery.com.
Figure 7-1. The site shows hundreds of mobile webapps created using jQuery Mobile, including some with a nice UI that looks really different than the standard theme
A theme is a set of color swatches defining:
Text colors
Background colors and gradients
Font
We can define up to 26 color swatches, from a to
z, while typically we will have at least five different
color swatches.
A theme also has a global definition that applies to every swatch color, including:
Text and box effects, such as shadows and rounded corners
Active state for buttons and other controls
The idea of a global definition is to maintain the same experience not matter which swatch color is applied. For example, in the default theme a selected button is always blue, not matter which color swatch is used for that button.
A theme is stored in a CSS file that is included in our HTML file with the structural CSS file provided by the framework. The structural CSS file should not be modified, as this could cause problems with future versions. ...
Become an O’Reilly member and get unlimited access to this title plus top books and audiobooks from O’Reilly and nearly 200 top publishers, thousands of courses curated by job role, 150+ live events each month,
and much more.
Read now
Unlock full access
More than 5,000 organizations count on O’Reilly
O’Reilly covers everything we've got, with content to help us build a world-class technology community, upgrade the capabilities and competencies of our teams, and improve overall team performance as well as their engagement.Julian F.
I wanted to learn C and C++, but it didn't click for me until I picked up an O'Reilly book. When I went on the O’Reilly platform, I was astonished to find all the books there, plus live events and sandboxes so you could play around with the technology.Addison B.
I’ve been on the O’Reilly platform for more than eight years. I use a couple of learning platforms, but I'm on O'Reilly more than anybody else. When you're there, you start learning. I'm never disappointed.Amir M.
I'm always learning. So when I got on to O'Reilly, I was like a kid in a candy store. There are playlists. There are answers. There's on-demand training. It's worth its weight in gold, in terms of what it allows me to do.