贪吃蛇2.0-键盘控制,H5游戏源码资源-CSDN文库

共11个文件

png：6个

jpg：2个

css：1个

游戏源码

需积分: 1 131 浏览量 2024-10-15 15:25:37 上传评论收藏 76KB RAR 举报

资源推荐

资源详情

资源评论

收起资源包目录

贪吃蛇2.0-键盘控制.rar （11个子文件）

贪吃蛇2.0-键盘控制

snake_2.0.js 16KB

snake_2.0.css 7KB

index.html 5KB

images

loser.png 13KB

gameBGImg1.png 1KB

keyDown.jpg 6KB

clock.png 5KB

start.png 4KB

space.jpg 7KB

pause.png 4KB

backGroundImg.png 30KB

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>JS网页版贪吃蛇小游戏 - 源码之家</title> <link rel="stylesheet" href="snake_2.0.css"> </head> <body>   <div class="main-start-interface" id="main-start-interface"> <h1 class="guide1 positonAb">贪吃蛇 2.0</h1> <h3 class="guide2 positonAb">Retro Snaker</h3> <h2 class="guide3 positonAb littleFinger" onClick="enterGame()">进入游戏</h2> <h2 class="guide4 positonAb littleFinger" onClick="setGame()">游戏设置</h2> <h2 class="guide5 positonAb littleFinger" onClick="quitGame()">退出游戏</h2> </div>  <div class="setGameModal" id="setGameModal"> <div class="setGameModal-layer"></div> <div class="setGameModal-content"> <h3 style="text-align: center;">游戏设置</h3> <div class="setGameModal-content-speed setGameModal-height"> <h4 style="display: inline;">游戏速度：</h4>  <input type="radio" name="speed" class="speed" value="200" id="highSpeed"> <label for="highSpeed" class="littleFinger">高速</label>   <input type="radio" name="speed" class="speed" value="500" id="mediumSpeed"> <label for="mediumSpeed" class="littleFinger">中速</label>   <input type="radio" name="speed" class="speed" value="800" id="lowSpeed"> <label for="lowSpeed" class="littleFinger">低速</label> </div> <div class="setGameModal-content-bgImage setGameModal-height"> <h4 style="display: inline;">背景图片：</h4> <input type="radio" name="gameBGImgRadio" class="gameBGImgRadio" value="url(images/gameBGImg1.jpg)" id="gameBGImg1"> <label for="gameBGImg1" class="littleFinger gameBGLabel"> <img src="images/gameBGImg1.jpg" alt=""> </label> <input type="radio" name="gameBGImgRadio" class="gameBGImgRadio" value="url(images/gameBGImg2.jpg)" id="gameBGImg2"> <label for="gameBGImg2" class="littleFinger gameBGLabel"> <img src="images/gameBGImg2.jpg" alt=""> </label> <input type="radio" name="gameBGImgRadio" class="gameBGImgRadio" value="url(images/gameBGImg3.jpg)" id="gameBGImg3"> <label for="gameBGImg3" class="littleFinger gameBGLabel"> <img src="images/gameBGImg3.jpg" alt=""> </label> </div> <div class="setGameModal-content-button setGameModal-height"> <input type="button" value="确认" onClick="sureSet()" id="sureSet"> <input type="button" value="取消" onClick="cancelSet()" id="cancelSet"> </div> </div> </div>  <div class="game-interface" id="game-interface"> <div class="left-side"> <div class="start-pause"> <img src="images/start.png" alt="" class="littleFinger" onClick="startPause()" id="startPause"> </div> </div> <div class="game-main"> <div class="game-main-header"> <div class="game-main-header-score fl"> <h3 style="display: inline;line-height: 40px;"> 分数:   </h3> <span style="line-height: 40px;" id="score"></span> </div> <div class="game-main-header-whenUsed fl"> <div class="whenUsed-image"> <img src="images/clock.png" alt=""> </div>    <span style="position:absolute;top: 10px" id="whenUsedTime"></span> </div> </div> <div class="game-main-content" id="gameMainContent"> </div> </div> <div class="right-side"> <div class="best-score"> <h4 style="display: inline;">最佳分数: </h4> <span id="bestScore">0</span> </div> <div class="space"> <h3>开始和暂停:</h3> <img src="images/space.jpg" alt=""> </div> <div class="key-down"> <h3>操作:</h3> <img src="images/keyDown.jpg" alt=""> </div> </div> </div>  <div class="loserModal" id='loserModal'> <div class="loserModal-layer"></div> <div class="loserModal-content"> <img src="images/loser.png" alt=""> <div class="loserModal-info"> <p style="margin-bottom: 10px;">得分：<span id="loserGetScore"></span></p> <p>用时：<span id="loserUseTime"></span></p> </div> <div class="loserModal-button"> <input type="button" value="再来一局" class="playAgain" onClick="playAgain()"> <input type="button" value="取消" class="cancelLoserModal" onClick="cancelLoser()"> </div> </div> </div> <script src="snake_2.0.js"></script> </body> </html>

评论收藏

内容反馈