HTML5 APP開發從入門到精通（微課精編版）

前端科技是由一群熱愛Web開發的青年教師和一線開發人員組成的團隊，主要從事Web開發、教學和培訓，所編寫的圖書在網店及實體店的銷量名列前茅，受到了廣大讀者的好評，讓數十萬的讀者輕鬆跨進了Web開發的大門，為IT技術的普及和應用做出了積極貢獻。

第1章移動APP開發概述1
1.1從移動開發說起2
1.1.1關於移動開發2
1.1.2移動Web開發歷史2
1.1.3移動Web開發的問題3
1.1.4移動Web開發的前景3
1.1 .5比較桌面和移動端Web開發3
1.2 HTML5與移動Web開發4
1.3移動Web與原生應用比較5
1.3.1移動Web 5
1.3.2原生應用5
1.3.3如何選擇應用方案6
1.4移動Web開發知識結構6
1.5初識移動Web開發技術8
1.5.1移動Web設計8
1.5.2關於WebKit 10

第2章HTML5基礎12
視頻講解：1小時3分鐘
2.1 HTML5概述13
2.1.1 HTML歷史13
2.1.2瀏覽器檢測13
2.1.3 HTML5語法特性14
2.2 HTML5文檔16
2.2.1編寫第一個HTML5文檔16
2.2.2比較HTML4與HTML5文檔結構17
2.3頭部信息18
2.3.1定義網頁標題18
2.3.2定義網頁元信息19
2.3.3定義文檔視口20
2.3.4移動Web頭信息21
2.4構建基本結構22
2.4.1定義文檔結構22
2.4.2定義內容標題23
2.4.3使用div元素25
2.4.4使用id和class.. 26
2.4.5使用title 27
2.4.6 HTML註釋27
2.5構建語義結構28
2.5.1定義頁眉28
2.5.2定義導航29
2.5.3定義主要區域31
2.5.4定義文章塊31
2.5.5定義區塊33
2.5.6定義附欄34
2.5.7定義頁腳34
2.5.8使用role 35
2.6案例實戰37
2.7在線練習39

第3章JavaScript基礎40
視頻講解：2小時12分鐘
3.1在網頁中使用JavaScript 41
3.1.1編寫腳本41
3.1.2腳本在網頁中的位置43
3.2 JavaScript基本規範44
3.3變量和類型44
3.3.1變量44
3.3.2數據類型45
3.4表達式和運算符46
3.4.1表達式46
3.4.2運算符47
3.5語句48
3.5.1表達式語句和語句塊48
3.5.2條件語句49
3.5.3循環語句51
3.5.4跳轉語句52
3.6函數53
3.6.1定義函數54
3.6.2調用函數55
3.6.3函數參數55
3.7對象57
3.7.1創建對象57
3.7.2訪問對象57
3.8數組58
3.8.1定義數組58
3.8.2存取元素59
3.9在線練習60

第4章使用HTML5訪問位置61
4.1 Geolocation API基礎62
4.1.1 Geolocation API應用場景62
4.1.2位置信息來源62
4.1.3位置信息表示方式62
4.1 .4獲取位置信息63
4.1.5瀏覽器兼容性65
4.1.6監測位置信息65
4.1.7停止獲取位置信息66
4.1.8保護隱私66
4.1.9處理位置信息66
4.1.10使用position.. 67
4.2案例實戰68
4.2.1定位手機位置68
4.2.2獲取經緯度及其詳細地址69
4.2.3輸入提示查詢位置70
4.2.4從當前位置查詢指定位置路線72
4.2.5記錄行踪路線73
4.3在線練習76

第5章使用HTML5訪問多媒體設備77
5.1 WebRTC基礎78
5.1.1認識WebRTC 78
5.1.2訪問本地設備78
5.2案例實戰80
5.2.1拍照和攝像80
5.2.2錄音並壓縮82
5.3在線練習85

第6章使用HTML5訪問傳感器86
6.1傳感器API基礎87
6.1.1認識傳感器API 87
6.1.2方向事件和移動事件87
6.1.3瀏覽器支持89
6.1.4應用場景89
6.2案例實戰89
6.2.1記錄搖手機的次數90
6.2.2重力測試小遊戲91
6.3在線練習93

第7章使用HTML5繪圖94
視頻講解：56分鐘
7.1使用canvas..95
7.2繪製圖形97
7.2.1矩形97
7.2.2路徑98
7.2.3直線99
7.2.4定義顏色100
7.2.5定義透明度101
7.2.6定義線性漸變103
7.2.7定義徑向漸變104
7.2.8定義陰影105
7.3繪製文字和圖像105
7.3.1繪製文字106
7.3.2導入圖像106
7.3.3將圖像寫入畫布108
7.3.4保存圖片108
7.4案例實戰110
7.4.1設計基本動畫110
7.4.2設計運動動畫112
7.4.3設計地球和月球公轉動畫114
7.4.4在畫布上裁剪圖像115
7.5在線練習117

第8章使用HTML5多媒體118
視頻講解：42分鐘
8.1使用HTML5音頻和視頻119
8.1.1使用119
8.1.2使用120
8.1.3設置屬性122
8.1.4設置方法122
8.1.5設置事件123
8.2案例實戰125
8.2.1獲取播放進度125
8.2.2設計視頻播放器126
8.2.3視頻自動截圖129
8.2.4視頻同步字幕133
8.3在線練習137

第9章使用HTML5表單138
視頻講解：52分鐘
9.1 HTML5表單特性139
9.2新的Input類型140
9.2.1 email-Email地址框140
9.2.2 url-URL地址框141
9.2.3 number數字框142
9.2.4 range範圍框.. 143
9.2.5 date pickers日期選擇器144
9.2 .6 search搜索框149
9.2.7 tel電話號碼框150
9.2.8 color拾色器151
9.3新的input屬性151
9.3.1 autocomplete自動完成152
9.3.2 autofocus自動獲取焦點153
9.3.3 form歸屬表單154
9.3.4表單重寫154
9.3.5 height（高）和width（寬） 155
9.3.6 list列表選項.. 155
9.3.7 min（最小值）、max（最大值）和
step（步長） 155
9.3.8 multiple多選156
9.3.9 pattern匹配模式156
9.3.10 placeholder替換文本157
9.3.11 required必填158
9.4新的表單元素158
9.4.1 datalist數據列表158
9.4.2 keygen密鑰對生成器159
9.4.3 output輸出結果159
9.5新的form屬性160
9.5.1 autocomplete自動完成160
9.5.2 novalidate禁止驗證161
9.6案例實戰162
9.6.1設計HTML5註冊表單162
9.6.2設計HTML5表單驗證164
9.7在線練習165

第10章使用HTML5離線和緩存166
視頻講解：31分鐘
10.1 Web Storage 167
10.1.1認識Web Storage 167
10.1.2使用Web Storage 167
10.1.3案例：設計登錄頁169
10.1.4案例：流量統計170
10.2 ApplicationCache API基礎171
10.2.1認識ApplicationCache API 172
10.2.2配置服務器173
10.2.3認識manifest 174
10.2.4使用ApplicationCache.. 176
10.2.5事件監聽180
10.3案例實戰181
10.3.1設計首頁緩存181
10.3.2設計離線編輯184
10.3.3設計移動便簽188
10.3.4設計離線留言190
10.4在線練習193

第11章使用HTML5推送消息194
視頻講解：12分鐘
11.1 WebSocket基礎195
11.1.1認識WebSocket 195
11.1.2使用WebSocket API 195
11.1.3在PHP中建立socket 198
11.2案例實戰200
11.2.1設計呼叫和應答200
11.2.2發送消息205
11.2.3使用Workerman框架通信206
11.2.4群發信息207
11.3在線練習209

第12章使用HTML5設計單頁無刷新應用210
視頻講解：20分鐘
12.1 History API基礎211
12.1.1了解History API 211
12.1.2使用History API 212
12.2案例實戰214
12.2.1設計導航頁面214
12.2.2設計無刷新網站216
12.2.3設計可後退畫板220
12.3在線練習222

第13章安裝jQuery Mobile 223
視頻講解：4分鐘
13.1認識jQuery Mobile 224
13.1.1為什麼要學習jQuery Mobile 224
13.1.2 jQuery Mobile特性224
13.1.3 jQuery Mobile兼容性226
13.2 jQuery Mobile與HTML5 226
13.3安裝jQuery Mobile 226
13.3.1下載jQuery Mobile 226
13.3.2配置jQuery Mobile 228
13.4案例：設計第一個移動頁面228

第14章視圖230
視頻講解：42分鐘
14.1設計頁面231
14.1.1定義單頁視圖231
14.1.2定義多頁視圖232
14.2設計對話框234
14.2 .1定義對話框234
14.2.2關閉對話框235
14.3設計彈出頁236
14.4應用彈出頁237
14.4.1彈出菜單237
14.4.2彈出表單239
14.4.3彈出對話框240
14.4.4彈出圖片241
14.4.5彈出視頻243
14.5設置彈出頁246
14.5.1顯示位置246
14.5.2切換動畫248
14.5.3主題樣式248
14.5.4關閉按鈕249
14.6案例實戰251
14.6.1設計電子閱讀器251
14.6.2設計論壇界面254
14.6.3設計記事本255
14.6.4設計彈出框257
14.6.5設計視圖樣式258
14.6.6設計視圖切換方式260
14.6.7設計相冊視圖262

第15章移動佈局264
視頻講解：30分鐘
15.1網格化265
15.2折疊塊268
15.2.1定義折疊塊268
15.2.2定義嵌套折疊塊269
15.2.3設置屬性270
15.2.4設置選項271
15.2.5設置事件275
15.3折疊組276
15.4移動表格277
15.4.1定義回流表格277
15.4.2定義字段切換錶格278
15.5滑動面板279
15.6案例實戰281
15.6.1設計課程表281
15.6.2設計九宮格283
15.6.3設計通訊錄284
15.6.4設計好友列表286

第16章列表視圖289
視頻講解：32分鐘
16.1定義列表視圖290
16.2定義嵌套列表290
16.3定義數字列表291
16.4定義分類列表292
16.5擴展功能294
16.5.1添加拆分按鈕294
16.5.2添加縮微圖和圖標295
16.5.3添加氣泡提示295
16.5.4添加過濾文本框296
16.6優化列表299
16.6.1插頁列表299
16.6.2折疊列表300
16.6.3自動分類列表302
16.7案例實戰304
16.7.1設計登錄表單304
16.7.2設計產品列表頁305
16.7.3設計新聞列表頁307
16.7.4設計播放列表309
16.7.5設計通訊錄311

第17章欄目構件313
視頻講解：30分鐘
17.1標題欄314
17.1.1定義標題欄314
17.1.2定義按鈕位置314
17.2頁腳欄316
17.2. 1定義頁腳欄316
17.2.2包含表單317
17.3導航欄318
17.3.1定義導航欄318
17.3.2定義導航圖標320
17.3.3定義圖標位置321
17.3.4自定義導航圖標322
17.4設置欄目構件324
17.4.1設置屬性324
17.4.2定義顯示模式325
17.4.3設置選項326
17.4.4設置方法和事件326
17.5案例實戰328
17.5.1設計播放器328
17.5.2設計按鈕組329

第18章按鈕組件332
視頻講解：15分鐘
18.1定義按鈕333
18.2定義內聯按鈕333
18.3定義按鈕圖標334
18.3.1圖標樣式334
18.3.2圖標位置335
18.4定義迷你按鈕336
18.5定義按鈕組337
18.6設置按鈕338
18.6.1定義屬性338
18.6.2定義選項338
18.6.3定義方法339
18.7自定義按鈕340
18.7.1自定義按鈕圖標340
18.7.2文本換行顯示341
18.8案例實戰341

第19章表單組件343
視頻講解：34分鐘
19.1使用表單344
19.2使用文本框345
19.3使用單選按鈕346
19.4使用複選框348
19.5使用滑塊350
19.6使用開關353
19.7使用菜單354
19.7.1定義下拉菜單354
19.7.2定義列錶框357
19.7.3設置選項分組359
19.7.4設置禁用選項360
19.8設置表單屬性360
19.8.1禁用表單361
19.8.2隱藏標籤361
19.8.3定義迷你表單362
19.9案例實戰363
19.9.1設計驗證表單363
19.9.2設計上傳表單364
19.9.3設計登錄表單365
19.9.4設計調查表單367
19.9.5設計設置表單368
19.9.6設計彈出表單369

第20章主題樣式371
視頻講解：18分鐘
20.1 jQuery Mobile主題372
20.2使用主題372
20.3自定義主題375
20.4使用ThemeRoller 377
20.4.1認識ThemeRoller 377
20.4.2設置ThemeRoller 378
20.4.3應用自定義色版379
20.5案例實戰381
20.5.1定義多視圖主題381
20.5.2設計計算器382
20.5.3設計鍵盤384

第21章腳本開發387
視頻講解：39分鐘
21.1自定義事件388
21.1.1觸摸事件388
21.1.2翻轉事件390
21.1.3滾屏事件392
21.1.4頁面事件393
21.2調用方法395
21.2.1轉換路徑395
21.2.2比較域名396
21.2.3縱向滾動397
21.3 HTML5應用399
21.3.1離線訪問399
21.3.2使用Web Storage傳遞參數400
21.3.3 HTML5畫板401
21.4配置jQuery Mobile 402
21.5案例實戰404
21.5.1偵測用戶動作404
21.5.2劃動面板405
21.5.3頁面初始化406
21.5.4以GET方式傳遞參數408
21.5.5自定義加載消息409
21.5.6管理加載消息411

第22章發布移動APP..413
22.1 Web應用發布基礎414
22.2下載、安裝Cordova 414
22.2.1安裝JAVA JDK 415
22.2.2安裝Android SDK 416
22.2.3安裝Apache Ant 417
22.2.4設置用戶變量417
22.2.5測試工具419
22.2.6通過npm安裝Cordova.. 420
22.2.7設置Android模擬器421
22.3將網頁轉換成Android APP 422

第23章實戰開發：移動版記事本項目424
視頻講解：32分鐘
23.1項目分析425
23.2框架設計425
23.3製作主頁面426
23.4製作列表頁430
23.5製作詳細頁433
23.6製作修改頁435
23.7製作添加頁439
23.8小結443

第24章實戰開發：移動博客項目444
視頻講解：22分鐘
24.1項目分析445
24.2主頁設計445
24.3列表頁設計447
24.4內容頁設計449
24.5後台開發451
24.5.1設計數據庫451
24.5.2連接數據庫453
24.5.3首頁功能實現455
24.5.4列表頁功能實現456
24.5.5內容頁功能實現459
24.6小結463