【开源游戏/休闲益智】水果五子棋

用户5997198

发布于 2019-12-20 16:57:32

44500

代码可运行

文章被收录于专栏：蚂蚁开源社区蚂蚁开源社区

运行总次数：0

代码可运行

游戏说明：

一款HTML5的五子棋小游戏，游戏中的棋子都是可爱的水果。如果你也喜欢五子棋游戏，那就赶快来挑战一下吧。

图片演示：

游戏通过鼠标左键/触摸进行操作，点击放置水果，五个连成一线的一方获得胜利。

如何开始：

游戏加载完毕点击播放键 - 再选择难度 - 点击向右按钮开始游戏

游戏目标：

阻止对手的棋子，并且尽快完成自己的五子连线！

代码简要解析：

HTML:

<div id="gameArea">
<div id="imgl2p"><img src="assets/graphics/p2l.jpg"></div>
<div id="background" style="-moz-user-select: none; -khtml-user-select: none; -webkit-user-select: none; user-select: none;"></div>
<canvas id="gameField" oncontextmenu="return false;"></canvas>
</div>
<div>

CSS:

    body {
      padding:0px;
      margin:0px;
    }
    #gameArea {
      position: fixed;
      display: table;
    }
    #imgl2p {
      display: none;
      text-align: center;
      vertical-align: middle;
      width: 100%;
      height: 100%;
    }
    #imgl2p img{
      width: 100%;
    }
    canvas, #bg, #background{
      display: block;
      position:absolute;
      width: 100%;
      height: 100%;
    }

本文参与腾讯云自媒体同步曝光计划，分享自微信公众号。

原始发表：2019-12-18，如有侵权请联系 cloudcommunity@tencent.com 删除

游戏