HTML5移动Web开发指南

第1章移动互联网时代的Web技术 1

1.1 移动互联网的发展 1

1.2 智能手机发展迅速 2

1.3 智能手机的Web浏览器 4

第1章移动互联网时代的Web技术 1

1.1 移动互联网的发展 1

1.2 智能手机发展迅速 2

1.3 智能手机的Web浏览器 4

1.4 移动Web应用的发展 7

1.5 基于HTML5的移动Web应用 8

第2章移动设备HTML5页面布局 12

2.1 页面语义化简介 12

2.1.1 HTML5新语义元素概述 12

2.1.2 更多HTML5新元素 16

2.2 页面结构与移动设备的布局 16

2.2.1 常见的移动应用布局 17

2.2.2 使用HTML5创建标准的移动Web页面 18

2.3 本章小结 22

第3章 HTML5规范的本地存储 23

3.1 移动设备的支持 23

3.2 localStorage 24

3.3 sessionStorage 28

3.4 Storage事件监听 29

3.5 本章小结 33

第4章移动Web的离线应用 34

4.1 离线Web概述 34

4.1.1 离线与缓存 34

4.1.2 离线的意义 35

4.2 移动设备的支持 35

4.3 applicationCache和manifest 36

4.3.1 manifest文件 36

4.3.2 applicationCache对象和事件 38

4.4 本章小结 39

第5章移动设备的常见HTML5表单元素 40

5.1 丰富的表单属性 40

5.2 移动Web表单的input类型 42

5.2.1 search类型文本 42

5.2.2 email类型文本 43

5.2.3 number类型文本 44

5.2.4 range类型文本 45

5.2.5 tel类型文本 45

5.2.6 url类型文本 46

5.2.7 更多的类型 46

5.3 表单属性应用范围 47

5.4 本章小结 47

第6章移动Web界面样式 48

6.1 CSS3 48

6.2 选择器 49

6.2.1 属性选择器 49

6.2.2 伪类选择器 51

6.3 阴影 53

6.3.1 box-shadow 53

6.3.2 text-shadow 54

6.4 背景 54

6.4.1 background-size 55

6.4.2 background-clip 55

6.4.3 background-origin 55

6.4.4 background 56

6.5 圆角边框 56

6.6 Media Queries移动设备样式 57

6.6.1 传统网站在iPhone上的显示问题 57

6.6.2 viewport设置适应移动设备屏幕大小 59

6.6.3 Media Queries如何工作 60

6.6.4 Media Queries语法总结 63

6.6.5 如何将官方网站移植成移动Web网站 65

6.7 本章小结 73

第7章Geolocation地理定位 74

7.1 功能介绍 74

7.2 浏览器支持情况 75

7.3 如何使用Geolocation API 75

7.3.1 首次获取当前位置 75

7.3.2 监视移动设备的位置变化 77

7.4 本章小结 78

第8章轻量级框架jQuery Mobile初探 79

8.1 jQuery Mobile概述 79

8.2 入门示例Hello World 80

8.2.1 部署文件 80

8.2.2 编码 81

8.3 基于HTML5的自定义属性驱动组件 82

8.3.1 dataset自定义属性 82

8.3.2 使用dataset属性驱动jQuery Mobile组件 83

8.4 页面与视图 85

8.4.1 标准的移动Web页面 85

8.4.2 移动设备的视图 86

8.4.3 多视图Web页面 88

8.4.4 改变页面标题的视图 90

8.4.5 视图切换动画 91

8.4.6 dialog对话框 92

8.4.7 页面主题 93

8.5 button按钮 94

8.5.1 button组件 94

8.5.2 具有icon图标的button组件 95

8.5.3 具有内联样式的button 98

8.5.4 具有分组功能的button按钮 99

8.6 Bar工具栏 102

8.6.1 如何使用工具栏 103

8.6.2 含有后退按钮的Header工具栏 104

8.6.3 多按钮的Footer工具栏 107

8.6.4 导航条工具栏 109

8.6.5 定义fixed工具栏 113

8.6.6 全屏模式工具栏 114

8.7 内容区域格式布局 114

8.7.1 网格布局 114

8.7.2 仿9宫格排列的按钮组例子 120

8.7.3 折叠块功能 122

8.7.4 创建具有手风琴效果的例子 124

8.8 Form表单 125

8.8.1 如何使用表单提交功能 126

8.8.2 HTML5文本框类型 126

8.8.3 HTML5搜索类型输入框 127

8.8.4 Slider类型 128

8.8.5 Toggle类型 129

8.8.6 单选按钮类型 130

8.8.7 复选框类型 133

8.8.8 下拉选择菜单 135

8.9 List列表 144

8.9.1 基本列表类型 145

8.9.2 普通链接列表 147

8.9.3 多层次嵌套列表 149

8.9.4 有序编号列表 151

8.9.5 只读列表 153

8.9.6 可分割按钮列表 154

8.9.7 列表的分隔符 155

8.9.8 列表搜索过滤器 157

8.9.9 含有气泡式计数的列表 159

8.9.10 显示列表项右侧文本格式的列表 160

8.9.11 列表项含有图标的列表 162

8.9.12 数据项含有图片的列表 163

8.9.13 内嵌列表 164

8.9.14 列表的性能问题 166

8.10 配置选项 166

8.11 Event事件 170

8.11.1 页面加载事件 171

8.11.2 其他事件类型 171

8.12 实用方法和工具 173

8.12.1 页面视图辅助工具 174

8.12.2 数据存储 176

8.12.3 地址路径辅助工具 177

8.12.4 loading显示/隐藏 184

8.13 主题系统 185

8.14 本章小结 186

第9章重量级富框架Sencha Touch入门 187

9.1 Sencha Touch概述 187

9.1.1 功能特点 187

9.1.2 官方套件包 188

9.2 入门示例Hello World 190

9.2.1 部署文件 190

9.2.2 开始编码 190

9.2.3 调试环境 192

9.2.4 页面调整 192

9.3 事件管理 194

9.3.1 自定义事件 194

9.3.2 初始化事件 195

9.3.3 Touch触控事件 196

9.3.4 事件管理器Ext.EventManager 197

9.4 核心组件库 199

9.4.1 Ext.lib.Component 199

9.4.2 属性、方法、事件 200

9.5 Toolbar工具栏 210

9.5.1 创建一个只有标题的工具栏例子 211

9.5.2 模拟前进返回按钮的工具栏例子 212

9.5.3 具有图标效果按钮的工具栏例子 214

9.5.4 按钮组的工具栏 216

9.6 Tabs选项卡 219

9.6.1 使用TabPanel组件定义Tab页面 219

9.6.2 选项卡功能 220

9.7 Carousel 222

9.8 Overlays遮罩层 224

9.8.1 Alert提示信息类型 224

9.8.2 Confirm确认提示框类型 226

9.8.3 Prompt提示输入类型 227

9.8.4 ActionSheet选择器类型 229

9.8.5 Overlay浮动层显示框类型 232

9.9 Picker选择器 234

9.9.1 创建单列的选择器例子 235

9.9.2 创建允许选择日期的选择器例子 236

9.10 List列表 238

9.10.1 创建基本的列表例子 238

9.10.2 改进的分组列表例子 240

9.10.3 使用Ajax异步请求的列表 242

9.10.4 XTemplate模板的应用 245

9.11 对HTML5的支持和封装 249

9.11.1 封装HTML5新表单元素 249

9.11.2 HTML5表单应用例子 249

9.11.3 封装GeoLocation地理定位功能 252

9.11.4 本地存储的支持 255

9.11.5 多媒体的支持 257

9.12 MVC开发模式 258

9.12.1 MVC介绍 258

9.12.2 创建application应用程序 259

9.12.3 Model实体对象 262

9.12.4 View视图类 267

9.12.5 setActiveItem使用方法 268

9.12.6 Controller业务逻辑类 270

9.13 本章小结 272

第10章跨平台的PhoneGap应用介绍 273

10.1 PhoneGap概述 273

10.2 搭建PhoneGap开发环境 274

10.2.1 如何在Android平台下搭建PhoneGap开发环境 275

10.2.2 如何在iOS平台下搭建PhoneGap 280

10.3 硬件设备接口 283

10.3.1 Accelerometer加速度传感器 283

10.3.2 Compass对象获取指南针信息 286

10.3.3 使用connection对象检测网络状态 289

10.3.4 File对象操作文件系统 290

10.3.5 使用Device对象获取移动设备的信息 307

10.4 软件接口 309

10.4.1 Camera对象获取照片资源 309

10.4.2 Capture对象采集多媒体资源 312

10.4.3 使用Contacts对象获取通信录资源 317

10.4.4 公告警示信息 326

10.4.5 Media对象 328

10.5 Events事件 328

10.5.1 公共事件 329

10.5.2 网络状态事件 332

10.5.3 Android专有事件 333

10.6 HTML5特性 335

10.6.1 GeoLocation定位位置 336

10.6.2 Storage特性 336

10.7 本章小结 336

第11章构建基于HTML5的生活轨迹Web App 337

11.1 项目背景 337

11.1.1 功能介绍 337

11.1.2 功能模块 339

11.2 创建基本应用程序 340

11.2.1 创建首页 340

11.2.2 创建入口函数 341

11.3 设置Model数据模型 343

11.3.1 创建Model实体类 343

11.3.2 设置Store对象 344

11.4 创建View视图组件 344

11.4.1 列表视图 344

11.4.2 列表组件 346

11.4.3 表单视图 346

11.4.4 浏览生活轨迹视图 349

11.4.5 Sheet组件选择更多功能 350

11.5 业务逻辑 352

11.5.1 定义controller类 352

11.5.2 实现视图之间的切换 352

11.5.3 保存生活轨迹内容 355

11.5.4 实现Geolocation地理定位 355

11.5.5 显示生活轨迹内容 357

11.5.6 显示Google地图 358

11.5.7 显示Sheet组件函数 360

11.5.8 清除所有存储的列表函数 360

11.5.9 删除一条记录的函数 361

11.6 缓存文件 362

11.6.1 设置manifest文件内容 362

11.6.2 设置HTML缓存文件 363

11.7 后端服务器通信 364

11.8 本章小结 365

第12章进阶之路 366

12.1 重新理解HTML5 366

12.2 浏览器的Web开发文档 367

12.3 网站或社区的推荐 367

12.4 移动Web应用框架 368

选择器 选择器是CSS3中一个重要的部分，通过使用CSS3的选择器，可以提高开发人员的工作效率。在本节中，我们将为读者介绍属性选择器和伪类选择器的基本用法。...

(查看全部试读)