美國馬克贊編著的《HTML5遊戲開發實戰》**適合用來繫統學習HTML5遊戲開發，通過精心挑選的示例講解了如何使用*新的HTML5和CSS3技術來構建紙牌類、繪圖類、物理類以及其他類型的遊戲，甚至包括多人的網絡遊戲。本書的思路**清晰，內容繫統全面，以迭代的方式講解了6款富有趣味的遊戲的實現過程，根據書中的提示動手實踐，不僅能獲得實戰經驗，而且能掌握關於HTML5和CSS3的理論知識，以及遊戲開發與設計的方法和技巧。

美國馬克贊編著的《HTML5遊戲開發實戰》是一本經典的HTML5遊戲開發 教程，它清晰而全面地展示了如何使用最新的HTML5和CSS3標準來構建各種 常見類型的遊戲。本書實戰性非常強，圍繞紙牌遊戲、繪圖遊戲、物理遊戲 和多人遊戲精心組織了6個富有趣味性和技術性的遊戲案例。如果動手實踐 這些案例，不僅能掌握各種類型遊戲的開發思路和設計方法，而且還能掌握 HTML5和CSS3技術中與遊戲開發相關的理論知識。本書共分9章，第1章介紹 HTML5、CSS3，以及相關的JavaScript API 新功能；第2章通過使用DOM和 jQuery創建傳統遊戲；第3章討論如何用DOM和CSS3來創建遊戲；第4章介紹 在頁面如何通過Canvas來繪制遊戲並與之交互；第5章介紹如何在Canvas中 繪制漸變效果和加入圖像；第6章使用Audio元素給遊戲添加聲音效果和背景 音樂；第7章使用新的本地存儲API保存和恢復遊戲進度，進一步增強遊戲； 第8章討論如何實現多人聯網玩遊戲；第9章講解如何把Box2D集成到Canvas 遊戲中。 《HTML5遊戲開發實戰》以實例為導向，繫統介紹網絡遊戲開發技術， 結合具體示例的操作步驟講解，淺顯易懂，適合網絡遊戲開發人員、管理人 員閱讀。

審校者簡介
譯者序
前言

第1章　HTML5遊戲概述
1.1　探索HTML5新功能
1.1.1　Canvas
1.1.2　音頻
1.1.3　GeoLocation
1.1.4　WebGL
1.1.5　WebSocket
1.1.6　本地存儲
1.1.7　離線應用程序
1.2　探索CSS3新功能
1.2.1　CSS3轉換
1.2.2　CSS3變換
1.2.3　CSS3動畫
1.3　HTML5和CSS3新功能的*多細節
1.4　創建HTML5遊戲的好處
1.4.1　不需要第三方插件
1.4.2　不需要插件就能支持iOS設備
1.4.3　突破常規瀏覽器遊戲限制
1.4.4　創建HTML5遊戲
1.5　HTML5還能做些什麼
1.5.1　《記憶配對》遊戲
1.5.2　Sinuous
1.5.3　小行星式書簽小程序
1.5.4　Quake
1.5.5　蝌蚪聊天室
1.5.6　Scrabb.ly
1.5.7　Aves引擎
1.6　瀏覽*多HTML5遊戲
1.7　本書主要涉及哪些遊戲
1.8　總結

第2章　DOM遊戲開發入門
2.1　準備開發工具
2.2　為DOM遊戲準備HTML文檔
2.2.1　新式HTML5 doctype聲明
2.2.2　頁眉和頁腳
2.2.3　JavaScript代碼*佳位置
2.2.4　頁面加載完後運行代碼
2.3　設置《乒乓球》遊戲元素
2.3.1　jQuery簡述
2.3.2　jQuery選擇器基礎知識
2.3.3　jQuery css函數
2.3.4　使用jQuery的好處
2.3.5　使用jQuery操縱DOM遊戲元素
2.3.6　**位置的行為
2.4　獲取玩家的鍵盤輸入
2.4.1　了解按鍵代碼
2.4.2　讓常數*具可讀性
2.4.3　用parseInt函數將字符串轉換為數字
2.4.4　在控制臺面板中直接執行JavaScript表達式
2.4.5　檢查控制臺窗口
2.5　支持玩家多鍵盤同時輸入
2.5.1　*好地聲明全局變量
2.5.2　用setInterval函數創建JavaScript定時器
2.5.3　理解遊戲主循環
2.6　通過JavaScript間隔移動DOM對像
2.7　開始踫撞檢測
2.8　動態顯示HTML文本
2.9　總結

第3章　用CSS3構建《紙牌記憶配對》遊戲
3.1　用CSS3轉換和變換模塊移動遊戲對像
3.1.1　2D變換函數
3.1.2　3D變換函數
3.1.3　用CSS3轉換實現樣式間過渡
3.2　創建翻牌效果
3.2.1　使用jQuery toggleClass函數切換類
3.2.2　通過z-index控制重疊元素的可見性
3.2.3　介紹CSS perspective屬性
3.2.4　介紹背面可見性
3.3　創建《紙牌記憶配對》遊戲
3.3.1　下載紙牌精靈表圖像
3.3.2　設置遊戲開發環境
3.3.3　使用jQuery復制DOM元素
3.3.4　使用jQuery的子節點過濾器選擇**子元素
3.3.5　垂直對齊DOM元素
3.3.6　通過背景位置來使用CSS精靈
3.4　給配對遊戲添加遊戲邏輯
3.4.1　在CSS轉換完後執行代碼
3.4.2　翻牌後延遲代碼的執行
3.4.3　在JavaScript中隨機化數組
3.4.4　通過HTML5自定義數據屬性保存內部自定義數據
3.4.5　用JQuery訪問自定義數據屬性
3.4.6　制作其他紙牌遊戲
3.5　在遊戲中嵌入Web字體
3.6　總結

第4章　用Canvas和繪圖API構建《解題》遊戲
4.1　介紹HTML5 Canvas元素
4.2　在Canvas中繪制圓形
4.2.1　當Web瀏覽器不支持Canvas時的反饋信息
4.2.2　用Canvas的arc函數繪制圓和圖形
4.2.3　把角度轉換為弧度
4.2.4　在Canvas中執行路徑繪制的操作
4.2.5　在切換路徑樣式時先調用BeginPath
4.2.6　關閉路徑
4.2.7　將畫圓功能封裝成函數
4.2.8　在JavaScript中生成隨機數
4.2.9　保存圓的位置
4.3　在Canvas中畫線
4.4　通過Canvas中的鼠標事件與繪制對像交互
4.4.1　在Canvas元素中獲取鼠標位置
4.4.2　在Canvas中檢測鼠標事件是否發生在圓上
4.4.3　遊戲主循環
4.4.4　清除Canvas
4.5　在Canvas中檢測線的交點
4.6　制作《解題》遊戲
4.6.1　定義關卡數據
4.6.2　判斷是否過關
4.6.3　顯示當前關卡和完成進度
4.7　總結

第5章　構建大師級Canvas遊戲
5.1　用漸變色來填充圖形
5.1.1　給漸變添加色標
5.1.2　填充徑向漸變色
5.2　在Canvas中繪制文本
5.3　在Canvas中繪制圖像
5.3.1　使用drawImage函數
5.3.2　裝點Canvas遊戲
5.4　在Canvas中播放精靈表動畫
5.5　創建多層Canvas遊戲
5.6　總結

第６章　給遊戲添加聲音效果
6.1　給PLAY按鈕添加聲音效果
6.1.1　定義audio元素
6.1.2　播放聲音
6.1.3　暫停聲音
6.1.4　調整音量大小
6.1.5　使用jQuery 的hover事件
6.1.6　創建Ogg格式的音頻以支持Mozilla Firefox
6.1.7　不同Web瀏覽器所支持的音頻格式
6.2　構建迷你鋼琴音樂遊戲
6.2.1　在HTML5遊戲中創建場景
6.2.2　讓音樂播放可視化
6.2.3　為音樂遊戲選擇正確的歌曲
6.2.4　存儲和提取歌曲關卡數據
6.2.5　獲取遊戲的流逝時間
6.2.6　創建音樂點
6.2.7　移動音樂點
6.3　將PLAY按鈕與音樂遊戲場景鏈接起來
6.4　構建鍵盤驅動的迷你鋼琴音樂遊戲
6.4.1　通過按鍵來擊打三條音樂線
6.4.2　判斷按鍵是否擊中音樂點
6.4.3　通過給定索引將元素從數組中移除
6.5　給迷你鋼琴遊戲添加額外的功能
6.5.1　 根據玩家的表現而調整音樂音量
6.5.2　從遊戲中刪除音樂點
6.5.3　保存*近5個音樂點的成功率計數
6.5.4　記錄音符來得到關卡數據
6.6　音樂播放完後處理audio事件
6.7　總結

第7章　利用本地存儲技術保存遊戲數據
7.1　使用HTML5本地存儲技術保存數據
7.1.1　創建遊戲結束對話框
7.1.2　在瀏覽器中保存成績
7.1.3　通過本地存儲技術保存和加載數據
7.1.4　本地存儲隻保存字符串值
7.1.5　將本地存儲對像看做關聯數組
7.2　在本地存儲中保存對像
7.2.1　在JavaScript中獲取當前日期和時間
7.2.2　使用原生JSON將對像編碼成字符串
7.2.3　從JSON字符串中加載所保存的對像
7.2.4　在控制臺窗口中檢測本地存儲
7.3　用一種漂亮的彩帶效果來告訴玩家破記錄了
7.4　保存整個遊戲的進度
7.4.1　保存遊戲進度
7.4.2　從本地存儲中刪除記錄
7.4.3　在JavaScript中復制數組
7.4.4　恢復遊戲進度
7.5　總結

第8章　利用WebSocket構建多人 遊戲-《我畫你猜》
8.1　初試WebSocket Web應用程序
8.2　安裝WebSocket服務器
8.2.1　安裝Node.JS WebSocket服務器
8.2.2　創建廣播連接數的WebSocket服務器
8.2.3　初始化WebSocket服務器
8.2.4　在服務器端監聽連接事件
8.2.5　在服務器端獲取已連接的客戶端數
8.2.6　向所有已連接的瀏覽器廣播消息
8.2.7　創建客戶端來連接WebSocket服務器並獲取總連接數
8.2.8　建立WebSocket連接
8.2.9　WebSocket客戶端事件
8.3　使用WebSocket構建聊天室
8.3.1　向服務器發送消息
8.3.2　從客戶端發送消息到服務器
8.3.3　在服務器端接收消息
8.4　通過在服務端廣播接收到的消息來創建聊天室
8.5　使用Canvas和WebSocket制作共享繪圖板
8.5.1　構建本地繪圖板
8.5.2　廣播繪圖數據給所有已連接的瀏覽器
8.5.3　定義用於在客戶端與服務器之間進行通信的數據對像
8.5.4　將畫線數據打包成JSON以便於廣播
8.5.5　再現從其他客戶端接收到的畫線數據
8.6　構建多人遊戲：《我畫你猜》
8.6.1　控制多人遊戲的遊戲流程
8.6.2　在服務器端羅列出所有已連接客戶端
8.6.3　在服務器端發送消息給指定的連接
8.6.4　改進現有遊戲
8.7　用CSS裝點《我畫你猜》遊戲
8.8　總結

第9章　用Box2D和Canvas構建物理類汽車遊戲
9.1　安裝Box2d JavaScript庫
9.1.1　用b2World創建新的物理世界對像
9.1.2　用b2AABB定義物理邊界
9.1.3　給物理世界設置重力
9.1.4　設置 Box2D忽略休眠物體
9.2　在物理世界中創建靜態地面
9.2.1　創建物體形狀
9.2.2　創建物理物體
9.3　在Canvas上繪制物理世界
9.4　在物理世界裡創建動態的長方形
9.5　推進物理世界的時間
9.6　給遊戲安裝車輪
9.7　創建物理汽車
9.8　通過鍵盤給汽車施加動力
9.8.1　向物體施加動力
9.8.2　理解ApplyForce與ApplyImpulse之間的不同點
9.8.3　給遊戲環境添加坡道
9.9　在Box2D世界檢測踫撞
9.10　重啟遊戲
9.11　讓遊戲支持關卡
9.12　為Box2D繪制圖形輪廓
9.12.1　使用形狀和物體的userData屬性
9.12.2　根據物理物體的狀態來繪制每一幀圖像
9.12.3　在Canvas中旋轉和翻轉圖片
9.13　給遊戲添加裝飾，讓遊戲*具趣味性
9.13.1　用燃料的限制加速
9.13.2　用CSS3進度條顯示剩餘燃料
9.14　總結
9.14.1　HTML5 遊戲引擎
9.14.2　遊戲精靈以及貼圖
9.14.3　聲音效果

附錄　突擊測驗答案