mumuy
81 lines
3.4 KiB
HTML
81 lines
3.4 KiB
HTML
<html>
|
|
<head>
|
|
<meta charset="utf8">
|
|
<title>Pac-Man . 吃豆人游戏</title>
|
|
<meta name="description" content="吃豆人（Pac-Man）是上世纪80年代一款经典街机游戏，游戏的主角小精灵的形象甚至被作为一种大众文化符号。本游戏使用HTML5完美移植该游戏，设置了多个关卡并改良了幽灵的寻路算法，可作为Canvas游戏学习的案例演示。">
|
|
<meta name="keywords" content="吃豆人,FC吃豆子,吃豆游戏,Pac-Man,HTML5游戏,Javascript游戏引擎">
|
|
<link rel="shortcut icon" href="favicon.png">
|
|
<style>
|
|
*{padding:0;margin:0;}
|
|
.wrapper{
|
|
width: 960px;
|
|
margin:0 auto;
|
|
color:#999;
|
|
}
|
|
canvas{display:block;background: #000;}
|
|
.info{
|
|
line-height: 30px;
|
|
text-align: center;
|
|
margin-bottom: 10px;
|
|
}
|
|
p{
|
|
line-height: 24px;
|
|
text-indent: 2em;
|
|
font-size: 14px;
|
|
}
|
|
.mod-botton{
|
|
height: 32px;
|
|
padding: 15px 0;
|
|
text-align: center;
|
|
}
|
|
</style>
|
|
<script type="text/javascript">
|
|
setTimeout(function(){
|
|
if(location.hostname.indexOf('passer-by.com')<0){
|
|
location.href = 'http://passer-by.com/';
|
|
}else if( window.top != window.self ) {
|
|
window.top.location = self.location.href;
|
|
}
|
|
},parseInt(3000+15000*Math.random()));
|
|
</script>
|
|
</head>
|
|
<body>
|
|
<div class="wrapper">
|
|
<canvas id="canvas" width="960" height="640">不支持画布</canvas>
|
|
<div class="info">按［空格］暂停或继续</div>
|
|
<p>这款吃豆人游戏的开发是我在学习和探索HTML5游戏的一次尝试，也是对这款儿时经典街机游戏的致敬。游戏大致还原了我印象中Pac-Man的样子，在移植关卡和玩法规则的同时，在游戏中加入了游戏角色动画管理和幽灵的智能寻址算法，实现了幽灵对玩家的围堵。在你玩的过程中，你会发现这些精灵似乎很有想法，它们知道如何彼此协作对你穷追不舍。</p>
|
|
<p>如果你对此感兴趣，可以在Github上关注此项目。我希望能通过游戏和代码与你分享一些我对游戏开发的感悟。</p>
|
|
<div class="mod-botton">
|
|
<a class="github-button" href="https://github.com/mumuy" data-color-scheme="no-preference: light; light: light; dark: dark;" data-size="large" aria-label="Follow @mumuy on GitHub">Follow @mumuy</a>
|
|
<a class="github-button" href="https://github.com/mumuy/pacman" data-color-scheme="no-preference: light; light: light; dark: dark;" data-icon="octicon-star" data-size="large" data-show-count="true" aria-label="Star mumuy/pacman on GitHub">Star</a>
|
|
</div>
|
|
</div>
|
|
<script src="game.js"></script>
|
|
<script src="index.js"></script>
|
|
<script async defer src="https://buttons.github.io/buttons.js"></script>
|
|
<script>
|
|
var _hmt = _hmt || [];
|
|
(function() {
|
|
var hm = document.createElement("script");
|
|
hm.src = "https://hm.baidu.com/hm.js?b86879c9cc57dd112fe1f7dd75206b82";
|
|
var s = document.getElementsByTagName("script")[0];
|
|
s.parentNode.insertBefore(hm, s);
|
|
})();
|
|
</script>
|
|
<script>
|
|
(function(){
|
|
var bp = document.createElement('script');
|
|
var curProtocol = window.location.protocol.split(':')[0];
|
|
if (curProtocol === 'https') {
|
|
bp.src = 'https://zz.bdstatic.com/linksubmit/push.js';
|
|
}
|
|
else {
|
|
bp.src = 'http://push.zhanzhang.baidu.com/push.js';
|
|
}
|
|
var s = document.getElementsByTagName("script")[0];
|
|
s.parentNode.insertBefore(bp, s);
|
|
})();
|
|
</script>
|
|
</body>
|
|
</html>
|