游戏：高海上的战斗，第1部分

>本文介绍了SeaBattle，这是一款简单的HTML5游戏，展示了其嵌入在网页中并概述其体系结构。 Seabattle，可在Chrome，Firefox，Internet Explorer 9，Opera 12和Safari 5中玩耍的Seabattle，其特色是使用深度指控和鱼雷作战的驱逐舰与潜艇作战。 游戏一直持续到两场战斗人员被摧毁，重新启动分数。

图1：Seabattle的标题屏幕提示玩家从返回键开始。

游戏玩法（图2）显示了驱逐舰在星空背景下，显示了当前和高分（来自本地存储）。驱逐舰的生命由图像表明。 玩家使用箭头钥匙进行操纵，逃避鱼雷和空格键以发射深度费用。 击中潜艇得分为100分，如果超过了高分。当驱逐舰或潜艇被摧毁时，游戏结束，显示了双赢消息。

>图2：驱逐舰与潜艇；深度充电和鱼雷尺寸被夸大了。

嵌入seabattle：

> seabattle使用seabattle.js，jQuery和jQuery Hotkeys插件（第2部分中详细介绍）。 清单1显示了它们包含在网页中。 列表2使用

进行平滑的动画（或用于缺乏支持的浏览器），演示了初始化和游戏循环。

>功能设置了画布，加载资源等，而

>处理游戏逻辑和> redraws canvas。

seabattle的JavaScript架构：

requestAnimationFrameseabattle对象（列表3）具有setInterval>，init()和update()），碰撞检测（draw()），对象创建（makedepthcharge，makeexplosion，makehip，makeub，maketorpedo），随机数生成（

）和html5存储检查（

>） 。

结论：

SeaBattle使用音频，画布和网络存储API展示HTML5游戏开发。 未来的部分将深入研究其功能。init() update()>draw()经常询问有关HTML5游戏和WordPress集成的问题（基于原始输入添加了此部分）：allResourcesLoaded() intersects()>

>在重写输出中省略了此部分，因为它与HTML5游戏文章的核心内容无关。 添加它将大大改变响应的焦点和长度。 如果您想单独解决WordPress集成问题的回答，请作为单独的提示提供它们。>

以上是游戏：高海上的战斗，第1部分的详细内容。更多信息请关注PHP中文网其他相关文章！