欢迎来到天天文库
浏览记录
ID:34723719
大小:195.18 KB
页数:9页
时间:2019-03-10
《javascript实现打地鼠小游戏》由会员上传分享,免费在线阅读,更多相关内容在工程资料-天天文库。
1、JavaScript实现打地鼠小游戏一、项目简介本项目名为打地鼠,是大家耳熟能详的一款经典的小游戏。游戏最终将会以html文件形式完成,需要使用Firefox等浏览器打开才能看到游戏的最终效果。此外,游戏将会采用JavaScript实现整个逻辑流程,所以建议没有JavaScript基础的同学首先学习javaScript教程。游戏最终效果截图如下:二、核心方法介绍在打地鼠小游戏中将会多次用到JavaScript中的计时函数:·setTimeout()·setInterval()这两个函数的作用很大,不仅仅在本次的小游戏中,在很多的
2、JavaScript程序中都会有“他们”的身影。接下来将会详细的剖析这两个函数。1.setTimeout()用于在指定的毫秒数后调用函数或计算表达式(只执行一次,可通过创建一个函数循环重复调用setTimeout,来实现重复操作)用法示例·setTimeout("functionName()",1000);·setTimeout(functionName,1000);调用一个无参的方法很简单,但当我们需要调用一个带有参数的函数时,问题就来了。解决的方法就是再写一个函数,该函数返回一个不带参数的函数。示例如下:functionsh
3、ow(name){ alert(name+",你好!"); } functionreturnFun(name){ returnfunction(){ show(name); }; } setTimeout(returnFun("小明"),1000);clearTimeout()立即终止setTimeout()方法。示例:vartimeId=setTimeout(...); clearTimeout(timeId);2.setInterval()可按照指定的周期(毫秒)来调用函数或计算表达式。与setTimeout()不同,不论
4、调用的函数或计算表达式需要多长时间才能执行完,它都只是简单的每隔一定时间就重复执行一次那个函数或计算表达式。用法示例·setInterval("functionName()",1000);·setInterval(functionName,1000);clearInterval()立即终止setInterval()方法。示例:varinterId=setInterval(...); clearInterval(interId);三、游戏制作1.功能逻辑设计功能包括:·得分统计·计算成功率·老鼠图片的隐藏、显示·判断是否点中老鼠·
5、最终结果显示·错误提示流程设计:·点击“开始游戏”按钮游戏开始,否则将提示“请点击开始游戏”字样·分数、命中率显示重置为“0”,倒计时开始(默认为30秒)·老鼠图片不断显示、隐藏,玩家可点击鼠标左键进行游戏·当30秒倒计时结束或者玩家主动点击“结束按钮”时,游戏结束并显示游戏结果游戏设计简单,并未添加其他丰富的游戏设计,也没有添加动画、声音等特殊效果,其目的是想带领大家从简洁的游戏逻辑设计中清楚地体会到从设计到开发、完善的乐趣,能通过简单的几行代码也能轻松实现一个属于自己制作的小游戏。2.框架设计游戏通过html文件实现,自然离
6、不开html标签,常见的打地鼠游戏都是规则的几个固定位置随机出现老鼠,因此本次游戏设计将会采用
7、auto; text-align:center; } table{ margin:0auto; } table:hover{ cursor:url('img/chuizi.png'),auto;//此处图片路径要依据自己的路径来修改 } td{ width:95px; height:95px; background-color:#00ff33; }
8、"button"value="开始游戏"onclick="GameStart()"> 分数: 当前文档最多预览五页,下载文档查看全文 侵权申诉 举报 1 1 2 3 4 5 / 9 此文档下载收益归作者所有 下载文档 当前文档最多预览五页,下载文档查看全文 点击下载本文档 版权提示 下载文档 举报 温馨提示: 1. 部分包含数学公式或PPT动画的文件,查看预览时可能会显示错乱或异常,文件下载后无此问题,请放心下载。 2. 本文档由用户上传,版权归属用户,天天文库负责整理代发布。如果您对本文档版权有争议请及时联系客服。 3. 下载前请仔细阅读文档内容,确认文档内容符合您的需求后进行下载,若出现内容与标题不符可向本站投诉处理。 4. 下载文档时可能由于网络波动等原因无法下载或下载错误,付费完成后未能成功下载的用户请联系客服处理。 相关文章 更多 基于labview的打地鼠小游戏 创新周_小游戏打地鼠报告 基于labview的打地鼠小游戏大学论文.doc 创新周_小游戏打地鼠报告 基于arduino的打地鼠小游戏设计 《打地鼠FPGA实现》PPT课件 打地鼠小游戏JAVA代码 基于某labview地打地鼠小游戏 打地鼠-fpga实现 Javascript实现打地鼠小游戏.doc 相关标签 javascript 小游戏 地鼠 实现
此文档下载收益归作者所有