The target=???_self??? attribute is needed to override default
iUI behavior, which would prevent the link from calling the Phone application. Also, to degrade
gracefully when running on iPod touch, the onclick handler ensures that the link works only if running
on iPhone. Finally, the label is assigned a cui class.
The fieldset and row class styling are already defined in the iui.css. However, several additional styles
need to be defined inside of the cui.css file. First, styles need to be defined for the labels and service
links. Second, a set of styles needs to be added to emulate the push-down effect of the services link when
a user presses it with a finger. The rules are shown in the following code:
.row > label.cui {
position: absolute;
margin: 0 0 0 14px;
line-height: 42px;
font-weight: bold;
color: #7388a5;
}
(continued)
Chapter 7: Integrating with iPhone Services
162
.cuiServiceLink {
display: block;
margin: 0;
border: none;
padding: 12px 10px 0 80px;
text-align: left;
font-weight: bold;
text-decoration: inherit;
height: 42px;
color: inherit;
box-sizing: border-box;
}
.row[cuiSelected] {
position: relative;
min-height: 42px;
border-bottom: 1px solid #999999;
-webkit-border-radius: 0;
text-align: right;
background-color: #194fdb !important;
color: #FFFFFF !important;
}
.
Pages:
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193