您的位置:首页 - 教程 - 网页特效 - 正文
jQuery制作的扫雷游戏
《扫雷》是一款大众类的益智小游戏,于1992年发行。
游戏目标是在最短的时间内根据点击格子出现的数字找出所有非雷格子,同时避免踩雷。

在线试玩

鼠标左键标记非雷格子,右键标记地雷。如果左键点到地雷游戏失败。

这是何问起扫雷成功的一个例子:


HTML文档代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 /><meta name="viewport" content="width=device-width, initial-scale=1" />
<title>jQuery扫雷游戏源码下载 - 何问起</title>
<base target="_blank" />
<link rel="stylesheet" type="text/css" media="screen" href="http://hovertree.com/texiao/game/7/css/styles.css" />

</head>
<body>
<div class="wrapper">
<h1>扫雷 Minesweeper</h1>
<div id="minesweeper">
<ul class="level-select">
<li><button data-level="easy">Easy</button></li>
<li><button data-level="mid">Medium</button></li>
<li><button data-level="hard">Hard</button></li>
</ul>
<div class="menu">
<ul>
<li class="timer">000</li>
<li class="reset"><button> :) </button></li>
<li class="mine-count">010</li>
</ul>
</div>
<div id="mine-grid"></div>
</div>
</div>
<script src="http://down.hovertree.com/jquery/jquery-1.11.2.min.js"></script>
<script type="text/javascript" src="http://hovertree.com/texiao/game/7/js/JSweeper.js"></script>

<div style="text-align:center;margin:10px 0; font:normal 14px/24px 'MicroSoft YaHei';">
<p>适用浏览器:360、FireFox、Chrome、Safari、Opera、傲游、搜狗、世界之窗. 不支持IE8及以下浏览器。</p>
<p>来源:<a href="http://hovertree.com/">何问起</a> <a href="http://hovertree.com/menu/texiao/">网页特效</a>
<a href="http://hovertree.com/h/bjaf/xbw6ou63.htm">代码说明</a></p>
</div>
</body>
</html>


推荐:http://hovertree.com/texiao/game/

http://hovertree.com/texiao/html5/33/

http://hovertree.com/game/10/

http://hovertree.com/game/

评论: