小编这次要给大家分享的是详解Javascript如何实现秒表计时游戏,文章内容丰富,感兴趣的小伙伴可以来了解一下,希望大家阅读完这篇文章之后能够有所收获。
一、说明
本游戏页面设计分为左右两栏。左上为跑马灯,左下为计时器和”START”按钮;右上为排行榜,右下为游戏规则说明。
跑马灯用的是定时器,循环走一遍。计时器是从”00:00:000”开始计时,需要点击”START”按钮开始游戏,停止游戏是点击空格键。游戏计算的是停止时间时刻和”00:10:000”时刻,也就是和10秒整的时间差。注意如果是在10秒前按下空格键停止,是有惩罚的,惩罚为之前计算的时间差翻倍。最后是按最终时间差从小到大顺序进行排名。
二、效果展示
三、代码
3.1 HTML
计时小游戏
00: 00: 000
排行榜 排名 玩家ID 时间记录 是否罚时 时间差 计时游戏规则:点击"START"开始游戏,当秒表计时到10秒的时候,请按下键盘的空格键,系统将记录按下键盘时刻秒表与10秒时刻的时间差,并按照最终时间差从小到大顺序进行排名。 如果想要重新开始游戏,只需再次点击"START"。
注意:如果在秒表10秒前按下空格键,属于“抢跑”违规,需要罚时,最终时间差翻倍!